Difference between localStorage and sessionStorage

Apr 06, 2020 by Pankaj Kumar

Websites hosted on a browser have no capacity of having any memory to store user's data. A user visiting from one page to another page on a website will be treated as a new user every time. The browser provides different types of storage mechanisms (localStorage, sessionStorage, cookies) to overcome this issue. Storage mechanism enables the website you are visiting to keep track of your movement from one page to another page so that the same information doesn't get asked which is already given to the website.

localStorage, sessionStorage, and cookies are all client storage solutions that store in a single file in the user's system. Session data is stored on the server where the application/website is hosted. localStorage and sessionStorage, part of the web storage API, are two awesome tools to save the data in format of key/value pairs locally.

In this article, We will try to understand the difference between localStorage and sessionStorage.

What is localStorage?

It is a type of web storage that allows websites/applications to store and access data in the browser with no expiration date. This means the data stored in the browser will persist even after the browser window has been closed.

Syntax:

// Save data to localStorage

localStorage.setItem('key', 'Value');

// Get saved data from localStorage

let lastname = localStorage.getItem('key');

// Remove saved data from localStorage

localStorage.removeItem('key');

// Remove all saved data from localStorage

localStorage.clear();

What is sessionStorage?

The sessionStorage object stores data for only one session, Meaning the data is deleted when the browser tab is closed.

Syntax:

// Save data to sessionStorage

sessionStorage.setItem('key', 'value');

// Get saved data from sessionStorage

let lastname = sessionStorage.getItem('key');

// Remove saved data from sessionStorage

sessionStorage.removeItem('key');

// Remove all saved data from sessionStorage

sessionStorage.clear();