HTML5 LocalStorage

What is HTML5 LocalStorage?

HTML5 localStorage is a handy API that gives web developers access to 5MB store on a users local machine with no expiration date. Sure, there are other ways to store data client-side, but localStorage differs from cookies or sessionStorage in that localStorage is still there even after the browser is closed. It stores data with no expiration date. With localStorage, a web page can only access data stored by itself. I’ve created a Task Management App that uses localStorage to save data. Have a look if you’d like to see localStorage in action.

HTML5 LocalStorage

What is HTML5 Web Storage?

HTML5 Web Storage is the new spec that includes localStorage and sessionStorage. Cookies are no longer the only way for web pages to store data in the user’s browser. With HTML5 Web Storage, data can be stored securely within the user’s web browser. The data is stored in key/value pairs, and unlike cookies, both new storage methods restrict data access to the web page that stored it. This makes them much more secure. Like it’s name implies, sessionStorage holds the data for one browser session only.

What are its limitations?

Browser support is a big concern for any web developer wishing to use HTML5 localStorage. Luckily for us, web storage is supported in Internet Explorer 8+, Firefox, Opera, Chrome, and Safari. In most major browsers, localStorage data disappears after deleting all cookies. This is not good for the persistence of data. It will however, unlike sessionStorage, survive a cache clearing.

Also, there is a 5MB limit to the data that can be stored. For anything above that limit, IndexDB will be able to provide a storage method. With IndexDB, the user needs to grant permission to store the data. A separate database is created for each website and there are no quota limits.

What are some good uses for HTML5 LocalStorage?

This new spec has some powerful potential and is already being used extensively. This type of storage offers a lot of possibilities for web apps. Possible uses include caching data from the Web when it takes a long time to get it, saving user data to a list (HTML5 To-Do List), and maintaining the state of an interface. Can you think of any other uses?

What are your thoughts on localStorage? Please leave a comment below if you have anything to say about HTML5 localStorage.


Comments

Leave a Reply

Your email address will not be published. Required fields are marked *