LocalStorage Manager

View, add, edit and delete localStorage items with size tracking

What is it and how does it work?

The Web Storage API provides browsers with two mechanisms for storing key-value pairs locally: `localStorage` (persists until explicitly cleared) and `sessionStorage` (cleared when the browser tab closes). Unlike cookies, Web Storage data is never automatically sent to the server with HTTP requests — it's purely client-side. localStorage is domain-scoped: `app.example.com` and `other.example.com` are isolated, but `app.example.com` and `app.example.com/subpath` share the same localStorage. Storage capacity is typically 5–10 MB per origin (vs. 4 KB for cookies).

This tool provides a visual interface to inspect, add, edit, delete, import, and export localStorage entries in the current browser. It's invaluable for debugging web applications without opening DevTools, testing authentication token handling, inspecting cached data, and managing application settings. It also handles JSON parsing to display nested objects in a readable tree format.

Common use cases

• Auth token inspection: check what JWT or session token your web app stores in localStorage — view the token, decode it (paste into the JWT Decoder tool), and verify expiry without opening DevTools.
• Application state debugging: inspect the JSON-serialised state that React/Vue apps store in localStorage for persistence across page reloads — useful when the UI shows stale data.
• A/B test variant inspection: many A/B testing tools (Optimizely, LaunchDarkly) store feature flags and variant assignments in localStorage — view which variant a user is seeing.

Frequently asked questions

What is the difference between localStorage and sessionStorage?

`localStorage` persists indefinitely (until `localStorage.clear()` or the user clears browser data). `sessionStorage` is cleared when the browser tab is closed (each tab has its own sessionStorage). Both are domain-scoped and never sent to the server. Practical rule: use localStorage for long-term preferences (theme, language); use sessionStorage for per-session state (form drafts, navigation history within a tab).

How much data can localStorage hold?

The Web Storage specification does not mandate a specific limit, but browsers typically allow 5 MB per origin (Chrome, Firefox, Safari). Some browsers allow up to 10 MB. Values above this trigger a `QuotaExceededError`. The limit applies to the total size of all keys and values combined. Important: localStorage only stores strings — JSON objects must be serialised (`JSON.stringify`) and deserialised (`JSON.parse`).

Is localStorage secure?

localStorage has no built-in encryption or access control — any JavaScript running on the same origin can read all localStorage data. This is a significant concern for XSS attacks: if an attacker injects script into your page, they can steal all localStorage data including auth tokens. Security best practice: never store JWTs in localStorage if the token grants sensitive access — use `HttpOnly` cookies instead (which JavaScript cannot read). localStorage is appropriate for non-sensitive preferences and non-secret cached data.

What are the alternatives to localStorage for client-side storage?

Cookies: sent with every HTTP request, 4 KB limit, can be HttpOnly (XSS-safe), Secure (HTTPS-only), SameSite. IndexedDB: transactional database for large structured data (hundreds of MB), asynchronous API, supports indexes. Cache API: for caching HTTP responses in Service Workers (PWA). sessionStorage: like localStorage but tab-scoped. WebSQL: deprecated. For most web apps: cookies for auth tokens, localStorage for preferences, IndexedDB for large structured data.

Utility

Password Generator · QR Code Generator · Stopwatch · Countdown Timer · Calculator · Random Number Generator