Browsers can store key-value pairs in a better way than using cookies.
In this article, I am going to discuss HTML web storage that is used in Web browsers. Let’s dive into the explanation.
What are cookies?
Browser cookies are identified and read by “key-value” pairs. These tell cookies where to be sent and what data to recall. Cookies are stored in web browsers that contain users’ information, and they can store the user’s browsing activity, such as user’s details that entered through form fields and payment information.
There are two types of cookies that are more important.
• Persistence cookie
This cookie has a specific date and a time that expires. This expiration time can be changed by the developer according to the user’s need. This cookie is transferred through the server whenever a user visits the website or every time the user views a resource belonging to that website from another website.
• Session cookie
This is also known as an in-memory cookie because it exits only temporarily while the user is navigating a website. Sessions cookies are deleted when closing the browser. These cookies have no expiration time like persistence cookies.
Cookies are dangerous🤔
Cookies are safe since the data in cookies doesn’t change. They can’t infect computers with viruses or other malware. Some cyberattacks can hijack cookies and gain access to your browsing sessions.
Their ability to monitor people’s browsing histories poses a threat.
Third-party cookies are even more dangerous. They are generated by the ads that are linked to the web pages we are surfing. Even if users never click on the ads, visiting a site with ten ads will result in the creation of ten cookies.
Advertisers and analytics organizations can use third-party cookies to monitor an individual’s browsing history around the web on any site that contains their advertisements. So this is a major threat to the privacy of users.
Why we use HTML web storage.
Web Storage provides storing key-value pairs in browsers with a greatly enhanced capacity than the cookies. There are two main types of storage as local storage and session storage. They behave similarly to persistence cookies and session cookies that we discussed earlier.
Cookies are used to communicate with servers, they have been added automatically to all HTTP request headers and they can be accessed by both the server and client-side. But web storage isn’t set to the HTTP requests and its only falls under client-side scripting.
When we are discussing storage sizes, cookies are restricted to 4 kilobytes but web storage provides 5 -10 megabytes storage capacity.
Interface of web storage😇
Web storage exposes an associative array data model of keys and values that are both strings, making it a stronger programmatic interface than cookies.
How to use web storage?
Web Storage can store and access from one origin. There are two mechanisms within Web Storage that we can use.
- local Storage
- session Storage
Let’s discuss about their usage separately.
localStoragepersists even if the browser is closed and reopened.
- Stores data with no expiration date, so it gets removed through clearing the Browser cache and using
- This has the maximum storage limit amongst the three.
sessionStoragestores data for only one session it means, as long as the browser is open, including page reloads and restores
- Data is never transferred to the server.
- Storage limit is at most 5MB and its larger than cookie.
Here we discussed why we have to use HTML Web storage more than cookies. I assume this article will be really helpful to you for developing your knowledge and skills. Let’s meet with another interesting article in the future.
Thank you guys😍