sessionStorage ist der tab-lokale Bruder von localStorage: Er speichert Schlüssel-Wert-Paare im Browser, aber nur für die Lebensdauer des aktuellen Tabs oder Fensters. Wird der Tab geschlossen, sind die Daten weg.
Unterschied zu localStorage
Beide Objekte gehören zur Web Storage API und teilen sich dieselbe Programmierschnittstelle. Der entscheidende Unterschied ist der Geltungsbereich:
- localStorage bleibt dauerhaft erhalten und wird von allen Tabs derselben Domain geteilt.
- sessionStorage gehört zu genau einem Tab. Ein zweiter Tab mit derselben URL startet mit leerem Speicher. Ein Seiten-Reload behält die Daten — erst das Schließen des Tabs löscht sie.
- Das Duplizieren eines Tabs kopiert den sessionStorage-Inhalt in den neuen Tab.
// Tab-lokalen Wert setzen
sessionStorage.setItem('draft', 'Entwurf von Tab 1');
// Wert lesen (nur in diesem Tab!)
const draft = sessionStorage.getItem('draft');
// Löschen
sessionStorage.removeItem('draft');Typische Einsatzfälle
- Zwischengespeicherte Formulareingaben während eines mehrstufigen Prozesses
- Tab-spezifische Ansichten und Filter
- Einmalige Einführungshinweise pro Tab
- Daten, die beim Verlassen der Seite vergessen werden sollen (Datenschutz-Vorteil)
Limits
Wie localStorage gilt ein klassisches Limit von etwa 5 MB pro Origin, das sich beide Speicher teilen. Auch hier sind nur Strings erlaubt, und die Zugriffe laufen synchron. Für größere, strukturierte Daten ist IndexedDB die bessere Alternative.
Verwandte Grundlagen: localStorage, IndexedDB, Cookie, Session, SPA, DOM.