The Local Storage mechanism is a method through which string key/value pairs can be securely stored and later retrieved for use. The goal of this addition is to provide a comprehensive way through which interactive applications can be built (including advanced abilities, such as being able to work “offline” for extended periods of time).

Reasons to choose Local Storage : –

Data accessed over the internet can never be as fast as accessing data locally.
Data accessed over internet is not secure.
HTML5 storage is on client.

Persistent Local Storage :-

Native client applications use operating system to store data such as preferences or runtime state.
Stored in registry, INI files, XML or other places using key/value pairs.
Web applications can’t do this.

What are Cookies? :-

Invented early in Web history as a way to store persistent data (“magic cookies”).
Small pieces of information about a user stored by Web server as text files on user’s computer.
Can be temporary or persistent.
Included with every HTTP request – slows down the application by transmitting same information repeatedly.
Sends unencrypted data over internet with every HTTP request.
Limited to 4KB data Example: filling out a text form field.
Cookies not enough due to following reasons:-

Require more storage space.
On the client.
Beyond page refresh.
Not transmitted to server.
HTML5 Storage :-

Provides standardized API.
Implemented natively.
Consistent in all the browsers.
HTML5 storage is also named as “Web Storage”.
Previously part of HTML5 specifications.
Split into its own specification.
Different browsers may call it “Local Storage” or “DOM Storage”.
There are two types of storages which are used in different situations:

Session Storage
Local Storage
Session Storage: Session storage is designed for the situation where the user is making a single transaction but the other transactions are also carried out in the separate windows.

Example: The user has visited a site to buy plane tickets and has opened the two different windows of the same site. If the site used cookies to keep the track of the users action to buy the ticket, and if the user navigate to both the pages time and again. In this case the ticket purchased by the user will be leaked from one window to the other, and the user will buy two tickets for the same flight unknowingly.

HTML5 introduces the sessionStorage attribute which would be used by the sites to add data to the session storage which can be accessed by any page from the same site opened in that window i.e. session and as soon as you close the window, session would be lost.