Introduction

The Web Storage API defines a standard for how we can save simple data locally on a user’s computer or device. Before the emergence of the Web Storage standard, web developers often stored user information in cookies, or by using plugins. With Web Storage, we now have a standardized definition for how to store up to 5MB of simple data created by our websites or web applications.

Web Storage is supported in these browsers:
■ Safari 4+
■ Chrome 5+
■ Firefox 3.6+
■ Internet Explorer 8+
■ Opera 10.5+
■ iOS (Mobile)

HTML5 introduced two new APIs for in-browser persistent data storage: sessionStorage and localStorage. To test if a browser supports either of the Storage APIs, use the following feature-detect:


Local storage play a similar role to HTTP cookies, but there are a few key differences.

Cookies are intended to be read on the server side, whereas local storage is only available on the client side. If you need your server-side code to react differently based on some saved values, cookies are the way to go. Yet, Cookies are sent along with each HTTP request to your server and this can result in significant overhead in terms of bandwidth.

Local storage, just sits on the user’s hard drive waiting to be read, so it costs nothing to use.

In addition, we have significantly more size to store things using local storage. With cookies, we could only store 4KB of information in total.With local storage,
the maximum is 5MB.

Web storage stores data specific to browser. If the user visits a site in Safari, any data will be stored to Safari’sWeb Storage store. If the user then revisits the same site in Chrome, the data that was saved via Safari will be unavailable. Each browser’s storage is separate and independent.