Mit Local Storage speichern Websites Daten direkt in deinem Browser, damit sie zwischen Besuchen erhalten bleiben. Hier erfährst du, wie er funktioniert, wofür Websites ihn nutzen und was das für deine Website bedeutet.
Hast du schon einmal auf einer Website eine Einstellung gewählt, den Tab geschlossen und später alles genau so wiedergefunden, wie du es verlassen hast? Deine Anzeigeeinstellungen waren noch dieselben, deine gespeicherten Einträge waren noch da, und du musstest nichts neu einrichten. Das ist Local Storage, der still im Hintergrund seine Arbeit macht.
Im vorigen Kapitel über Arten von Browser-Speicher haben wir Local Storage als eine der wichtigsten Möglichkeiten vorgestellt, wie Browser Daten halten. Dieses Kapitel geht tiefer darauf ein, was Local Storage eigentlich ist, wie er funktioniert und welche Rolle er auf deiner Website spielt.
Was ist Local Storage?
Local Storage ist eine Art von Browser-Speicher, mit der Websites kleine Daten direkt auf dem Gerät eines Besuchers speichern. Diese Daten bleiben im Browser, auch wenn der Besucher den Tab schliesst oder den Computer herunterfährt. Beim nächsten Besuch derselben Website hat der Browser die Daten noch, und die Website kann damit den früheren Zustand wiederherstellen.
Das unterscheidet Local Storage vom Session Storage, der beim Schliessen des Tabs gelöscht wird. Local Storage ist dauerhaft. Er hat kein automatisches Ablaufdatum. Die Daten bleiben, bis der Nutzer seinen Browser bereinigt oder die Website sie selbst entfernt.
Wie funktioniert Local Storage?
Local Storage funktioniert als einfacher Schlüssel-Wert-Speicher. Stell ihn dir wie einen kleinen Notizblock im Browser vor, in den eine Website Informationen mit einer Bezeichnung und einem Wert schreiben kann. Die Bezeichnung ist der Schlüssel, die gespeicherte Information der Wert. Braucht die Website die Information wieder, sucht sie den Schlüssel und holt den Wert.
Zum Beispiel könnte eine Website einen Schlüssel „theme“ mit dem Wert „dark“ speichern, wenn ein Besucher in den Dunkelmodus wechselt. Kommt der Besucher zurück, prüft die Website den Local Storage, findet den Schlüssel „theme“, liest den Wert „dark“ und wendet den Dunkelmodus automatisch an, noch bevor die Seite vollständig dargestellt ist.
Jede Website hat ihren eigenen, abgeschotteten Local Storage. Eine Website kann nur ihre eigenen Daten lesen und schreiben. Sie sieht nicht, was eine andere Website gespeichert hat. Diese Abschottung ist eine Sicherheitsfunktion, die in jedem Browser eingebaut ist.
Wofür nutzen Websites Local Storage?
Nutzervorlieben speichern
Anzeigeeinstellungen, Spracheinstellungen, Designwahl und Layout-Optionen sind gängige Dinge im Local Storage. Das sind nicht sensible Vorlieben, die das Erlebnis verbessern, wenn ein Besucher zurückkommt.
Einträge zwischen Sitzungen behalten
Manche Websites nutzen Local Storage, um Einträge zu halten, mit denen ein Besucher interagiert hat, etwa eine Leseliste, eine Wunschliste oder zuletzt angesehene Artikel. So sind sie beim nächsten Besuch noch da, auch wenn der Besucher nicht eingeloggt ist.
Serveranfragen verringern
Speichert eine Website Informationen lokal, kann sie diese sofort aus dem Browser holen, statt jedes Mal den Server zu fragen. Das beschleunigt das Erlebnis für wiederkehrende Besucher und entlastet das Backend.
Zustand in Formularen und mehrstufigen Abläufen behalten
Manche Websites nutzen Local Storage, um den Fortschritt in einem mehrstufigen Formular oder Bestellvorgang vorübergehend zu speichern. Schliesst ein Besucher versehentlich den Tab, geht sein Fortschritt beim Zurückkommen nicht verloren.
Welche Grenzen hat Local Storage?
Local Storage ist für kleine Daten gedacht. Die meisten Browser erlauben etwa 5 bis 10 Megabyte pro Website. Das reicht für Vorlieben und Einstellungen, aber nicht für grosse Dateien oder komplexe Datensätze. Ausserdem speichert er nur Text. Zahlen, Objekte und Listen müssen erst in Text umgewandelt werden, bevor sie gespeichert werden können, und beim Abruf wieder zurück.
Local Storage ist auch nicht der richtige Ort für sensible Informationen. Da jedes Skript auf der Seite darauf zugreifen kann, ist es ein Sicherheitsrisiko, Passwörter, persönliche Daten oder Zahlungsinformationen im Local Storage zu speichern. Sensible Daten gehören auf den Server, geschützt durch SSL und eine richtige Authentifizierung.
Einen direkten Vergleich von Local Storage mit den anderen Speicherarten findest du unter Arten von Browser-Speicher.
Häufig gestellte Fragen
Funktioniert Local Storage ohne Internetverbindung?
Ja. Local Storage wird auf dem Gerät des Besuchers gespeichert und nicht auf einem Server. Die Daten sind auch verfügbar, wenn der Browser offline ist. Das ist einer der Gründe, warum Local Storage oft zusammen mit Service Workern und Cache Storage genutzt wird, um Websites zu bauen, die teilweise oder ganz offline funktionieren.
Teilen sich verschiedene Browser auf demselben Gerät den Local Storage?
Nein. Local Storage ist browserspezifisch. Speicherst du Daten in einem Browser, sind sie in einem anderen Browser auf demselben Gerät nicht sichtbar. Jeder Browser führt seinen eigenen Local Storage. Wechselt ein Besucher von einem Browser in einen anderen, nimmt er seine gespeicherten Vorlieben und Daten also nicht mit.
Können Besucher ihre Local-Storage-Daten sehen oder löschen?
Ja. Jeder kann die Entwicklertools des Browsers öffnen und die Local-Storage-Daten jeder Website ansehen oder löschen. Besucher können ausserdem alle Browser-Daten über die Browser-Einstellungen löschen, wodurch auch der Local Storage komplett geleert wird. Websites sollten sich also nicht darauf verlassen, dass Local Storage eine dauerhafte oder garantierte Datenquelle ist.
Was ist der Unterschied zwischen Local Storage und Cookies?
Cookies werden bei jeder Anfrage an den Server zurückgeschickt und eignen sich deshalb für Sitzungsverwaltung und Authentifizierung. Local Storage bleibt nur im Browser und wird nie automatisch an den Server geschickt. Local Storage fasst ausserdem mehr Daten als Cookies und hat kein eingebautes Ablaufdatum. Jedes passt zu anderen Einsatzfällen, und gut gebaute Websites nutzen beides sinnvoll.
Beeinflusst Local Storage die Website-Geschwindigkeit?
Lesen aus und Schreiben in Local Storage ist sehr schnell und verursacht selten spürbare Geschwindigkeitsprobleme. Im Gegenteil: Wenn du Local Storage nutzt, um Vorlieben zwischenzuspeichern und Serveranfragen zu verringern, kann sich eine Website für wiederkehrende Besucher schneller anfühlen. Die Wirkung auf die Website-Geschwindigkeit ist meist positiv, wenn du Local Storage sinnvoll einsetzt.
Muss ich Local Storage auf meiner Website verwalten?
Wenn du einen Website-Builder nutzt, verwaltet die Plattform den Local Storage für die Funktionen, die sie unterstützt, automatisch. Du musst selbst nichts schreiben oder einstellen. Der Builder übernimmt Vorlieben und Zustandsverwaltung, die Local Storage nutzen, im Hintergrund. Beim Website-Builder von WEMASY ist das alles in die Funktionsweise der Plattform eingebaut.