HTML – Web storage


Web storage is the feature that introduces with html5 and As we know we store application data inside cookies, which include a lot of server requests. But after web storage, we have a more secure and elegant way to store data which provide a large amount of space to store data with awesome performance. Here we have at least a 5MB limit to store data locally.

Web storage is a way by which an application can store data locally inside a web browser. It’s used per origin. All pages can store the same amount of data.

In this api we have two main object –

  • window.sessionStorage ( data store for one session means when we close tab data will lost)
  • window.localStorage ( data store without expiration date )

// Check brwoser support

if ( typeof(Storage) != "undefined" ) {
	// works
} else {
	// Not supported by browser

Both Objects have the same method as –

setItem(key, value); //set stroage
getItem(key); // get stroage
removeItem(key); // remove key from stroage
clear(); // clear all stroage
key(index); // get stroage according to index

All values are stored inside Storage as a string so be careful when you are using storage API.
how to use Storage –

localStorage.setItem("no", 1); localStorage.getItem("no")); // string

So if you want to covert this string value into no you need to use the parseInt method.

localStorage.setItem("no", 1); parseInt(localStorage.getItem("no"))); // number

To more details and useful example you can read this article – Local storage techniques

You May Also Like

About the Author: Pankaj Bisht