Permanentspeicher

Nichtflüchtiger Speicher kann dazu beitragen, wichtige Daten vor der Bereinigung zu schützen und das Risiko von Datenverlusten zu verringern.

Bei Speicherauslastungen wie wenig Speicherplatz entfernen Browser normalerweise Daten aus der Cache API und aus IndexedDB aus dem am wenigsten verwendeten Ursprung. Dies kann zu Datenverlusten führen, wenn die App keine Daten mit dem Server synchronisiert hat. Außerdem wird die Zuverlässigkeit der App verringert, da Ressourcen entfernt werden, die für das Funktionieren der App erforderlich sind. Dies kann sich negativ auf die Nutzererfahrung auswirken.

Glücklicherweise haben Untersuchungen des Chrome-Teams ergeben, dass Daten von Chrome sehr selten automatisch gelöscht werden. Häufiger löschen Nutzer den Speicher manuell. Wenn also ein Nutzer Ihre Website regelmäßig besucht, ist die Wahrscheinlichkeit gering, dass Ihre Daten gelöscht werden. Wenn Sie verhindern möchten, dass der Browser Ihre Daten löscht, können Sie beantragen, dass der gesamte Speicher Ihrer Website als dauerhaft markiert wird.

Nichtflüchtiger Speicher wird in vielen modernen Browsern unterstützt.

Unterstützte Browser

  • 55
  • 79
  • 57
  • 15.2

Quelle

Weitere Informationen zum Entfernen, zur Speicherkapazität und zum Umgang mit Kontingentlimits finden Sie unter Speicher für das Web.

Prüfen, ob der Speicher Ihrer Website als dauerhaft markiert wurde

Mit JavaScript können Sie feststellen, ob der Speicher Ihrer Website als persistent markiert wurde. Beim Aufrufen von navigator.storage.persisted() wird ein Promise zurückgegeben, das mit einem booleschen Wert aufgelöst wird und angibt, ob der Speicher als beibehalten markiert wurde.

// Check if site's storage has been marked as persistent
if (navigator.storage && navigator.storage.persist) {
  const isPersisted = await navigator.storage.persisted();
  console.log(`Persisted storage granted: ${isPersisted}`);
}

Wann sollte ich um nichtflüchtigen Speicher bitten?

Der beste Zeitpunkt, um Ihren Speicher als persistent zu kennzeichnen, ist der Fall, wenn Sie wichtige Nutzerdaten speichern und die Anfrage idealerweise in eine Touch-Geste des Nutzers verpackt sein sollte. Fragen Sie beim Seitenaufbau oder in anderem Bootstrap-Code nicht nach dauerhaftem Speicher, da der Browser den Nutzer möglicherweise um Erlaubnis bittet. Wenn der Nutzer nichts tut, was seiner Meinung nach gespeichert werden muss, könnte die Aufforderung verwirrend sein und er wird die Anfrage wahrscheinlich ablehnen. Fragen Sie auch nicht zu oft nach. Wenn der Nutzer die Berechtigung nicht erteilt hat, fordern Sie beim nächsten Speichern nicht sofort wieder auf.

Nichtflüchtigen Speicher anfordern

Rufen Sie navigator.storage.persist() auf, um nichtflüchtigen Speicher für die Daten Ihrer Website anzufordern. Sie gibt ein Promise zurück, das mit einem booleschen Wert aufgelöst wird, der angibt, ob die Berechtigung für den nichtflüchtigen Speicher gewährt wurde.

// Request persistent storage for site
if (navigator.storage && navigator.storage.persist) {
  const isPersisted = await navigator.storage.persist();
  console.log(`Persisted storage granted: ${isPersisted}`);
}

Wie wird die Berechtigung gewährt?

Nichtflüchtiger Speicher wird als Berechtigung behandelt. Browser entscheiden anhand verschiedener Faktoren, ob Berechtigungen für nichtflüchtigen Speicher gewährt werden.

Chrome und andere Chromium-basierte Browser

Chrome und die meisten anderen Chromium-basierten Browser verarbeiten die Berechtigungsanfrage automatisch und zeigen dem Nutzer keine Aufforderungen an. Wenn eine Website als wichtig eingestuft wird, wird die Berechtigung für nichtflüchtigen Speicher automatisch gewährt. Andernfalls wird sie ohne Rückmeldung verweigert.

Die Heuristik, anhand derer Sie feststellen können, ob eine Website wichtig ist, umfassen Folgendes:

  • Wie hoch ist die Interaktion mit der Website?
  • Wurde die Website installiert oder als Lesezeichen gespeichert?
  • Wurde der Website die Berechtigung zum Anzeigen von Benachrichtigungen erteilt?

Wenn der Antrag abgelehnt wurde, kann er später noch einmal angefordert und anhand derselben Heuristik ausgewertet werden.

Firefox

Firefox delegiert die Berechtigungsanfrage an den Nutzer. Wenn nichtflüchtiger Speicher angefordert wird, wird der Nutzer in einem UI-Pop-up gefragt, ob die Website Daten im nichtflüchtigen Speicher speichern darf.

Ein Pop-up, das von Firefox angezeigt wird, wenn eine Website nichtflüchtigen Speicher anfordert.
Ein Pop-up, das in Firefox angezeigt wird, wenn eine Website nichtflüchtigen Speicher anfordert.

Welcher Speicher wird durch nichtflüchtigen Speicher geschützt?

Wenn die Berechtigung für den nichtflüchtigen Speicher gewährt wird, entfernt der Browser keine Daten, die hier gespeichert sind:

  • Cache-API
  • Kekse
  • DOM-Speicher (lokaler Speicher)
  • File System API (vom Browser bereitgestelltes und in der Sandbox ausgeführtes Dateisystem)
  • IndexedDB
  • Service Worker
  • App-Cache (eingestellt, sollte nicht verwendet werden)
  • WebSQL (eingestellt, sollte nicht verwendet werden)

Dauerhaften Speicher deaktivieren

Derzeit gibt es keine programmatische Möglichkeit, dem Browser mitzuteilen, dass Sie keinen nichtflüchtigen Speicher mehr benötigen.

Fazit

Untersuchungen des Chrome-Teams zeigen, dass gespeicherte Daten, obwohl möglich, von Chrome selten automatisch gelöscht werden. Zum Schutz wichtiger Daten, die möglicherweise nicht in der Cloud gespeichert sind oder zu einem erheblichen Datenverlust führen, kann nichtflüchtiger Speicher ein hilfreiches Tool sein, um dafür zu sorgen, dass Ihre Daten nicht vom Browser entfernt werden, wenn das lokale Gerät Speicherauslastung hat. Und denken Sie daran, dass Sie nichtflüchtigen Speicher nur dann anfordern, wenn es wahrscheinlich ist, dass der Nutzer ihn möchte.

Vielen Dank

Besonderen Dank an Victor Costan und Joe Medley für die Rezension dieses Artikels. Danke an Chris Wilson, der die Originalversion des Artikels verfasst hat, der erstmals bei WebFundamentals erschienen ist.

Hero-Image von Umberto auf Unsplash