🔹 What are LocalStorage & SessionStorage?
Both are part of Web Storage API in JavaScript.
They allow you to store key-value pairs in the browser.
🔹 Difference Between LocalStorage & SessionStorage
| Feature | LocalStorage | SessionStorage |
|---|---|---|
| Lifetime | Data persists even after closing the browser/tab | Data is cleared when tab/browser is closed |
| Scope | Shared across all tabs & windows of the same origin | Available only in the specific tab where it was created |
| Size Limit | Usually 5MB–10MB per origin | Same as LocalStorage (5MB–10MB) |
| Accessibility | Accessible via localStorage object |
Accessible via sessionStorage object |
| Use case | Storing long-term data (e.g., JWT token, user theme) | Storing temporary data (e.g., form input, OTP session) |
🔹 Example: LocalStorage
// Save data
localStorage.setItem("username", "Dev");
// Get data
console.log(localStorage.getItem("username")); // Dev
// Remove data
localStorage.removeItem("username");
// Clear all
localStorage.clear();
🔹 Example: SessionStorage
// Save data
sessionStorage.setItem("otp", "123456");
// Get data
console.log(sessionStorage.getItem("otp")); // 123456
// Remove data
sessionStorage.removeItem("otp");
// Clear all
sessionStorage.clear();
🔹 Summary (Interview Ready)
✅ LocalStorage → Permanent (survives browser restart), shared across tabs.
✅ SessionStorage → Temporary (cleared on tab close), unique to each tab.
✅ Both → Same size limit, same API.