LocalStorage and SessionStorage

LocalStorage and SessionStorage store data in the browser.

StorageLifetime
localStoragestays after closing the browser
sessionStoragelasts for the current tab/session

Basic Usage

localStorage.setItem("theme", "dark");
 
const theme = localStorage.getItem("theme");
 
localStorage.removeItem("theme");

Store Objects

Browser storage stores strings. Use JSON for objects.

const user = { name: "Yuwei", level: 1 };
 
localStorage.setItem("user", JSON.stringify(user));
 
const savedUser = JSON.parse(localStorage.getItem("user"));

When To Use

  • localStorage: preferences that should stay, like theme.
  • sessionStorage: temporary state for one browser tab.