JavaScript Web Storage

What is Web Storage?

Web Storage provides a way to store data in the browser so that you can persist data across page reloads.

It’s part of HTML5 and includes two main types:

localStorage
sessionStorage It’s simpler and more powerful than cookies for storing small amounts of data on the client side.

Types of Web Storage

Feature	localStorage	sessionStorage
Lifespan	Data persists even after closing the browser (until explicitly cleared)	Data persists only during the page session (lost on tab/window close)
Scope	Shared across all tabs/windows of the same origin	Unique to each tab/window
Storage limit	~5-10 MB	~5-10 MB

localStorage Example

Store data

localStorage.setItem("username", "Digital");

Retrieve data

let user = localStorage.getItem("username");
console.log(user); // Digital

Remove a specific item

localStorage.removeItem("username");

Clear all storage

localStorage.clear();

SessionStorage Example

Works the same way, but data is cleared when the tab or browser is closed.

sessionStorage.setItem("sessionId", "abc123");

let session = sessionStorage.getItem("sessionId");
console.log(session); // abc123

sessionStorage.removeItem("sessionId");
sessionStorage.clear();

Use case example	localStorage	sessionStorage
Remember user theme preference	✅
Cart data for anonymous checkout	✅
Temporary form data		✅
Keeping user logged in per tab		✅

JavaScript Web Storage

On this page