Permanentspeicher

Mit persistentem Speicher können Sie wichtige Daten vor dem Löschen schützen und das Risiko von Datenverlusten verringern.

Pete LePage

Wenn der Speicherplatz knapp wird, z. B. weil der Speicherplatz auf der Festplatte niedrig ist, entfernen Browser in der Regel Daten, einschließlich der Daten aus der Cache API und IndexedDB, vom am weitesten in der Vergangenheit verwendeten Ursprung. Dies kann zu Datenverlusten führen, wenn die App die Daten nicht mit dem Server synchronisiert hat, und die Zuverlässigkeit der App beeinträchtigen, da Ressourcen entfernt werden, die für die Funktion der App erforderlich sind. Beides führt zu einer negativen Nutzererfahrung.

Glücklicherweise zeigt die Forschung des Chrome-Teams, dass Daten nur sehr selten automatisch von Chrome gelöscht werden. Es ist weitaus üblicher, dass Nutzer den Speicher manuell löschen. Besucht ein Nutzer Ihre Website also regelmäßig, ist die Wahrscheinlichkeit gering, dass Ihre Daten entfernt werden. Wenn Sie verhindern möchten, dass der Browser Ihre Daten löscht, können Sie anfordern, dass der gesamte Speicher der Website als persistent markiert wird.

Der nichtflüchtige Speicher wird von vielen modernen Browsern unterstützt.

Weitere Informationen zu Auslagerung, zum Speicherplatz und zum Umgang mit Kontingenteinschränkungen finden Sie unter Speicherplatz für das Web.

Prüfen, ob der Speicherplatz Ihrer Website als persistent markiert wurde

Mit JavaScript können Sie feststellen, ob der Speicher Ihrer Website als persistent gekennzeichnet wurde. Der Aufruf von navigator.storage.persisted() gibt ein Versprechen zurück, das mit einem booleschen Wert aufgelöst wird, der angibt, ob der Speicher als dauerhaft gekennzeichnet 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 nichtflüchtigen Speicher anfordern?

Der beste Zeitpunkt, um anzufordern, dass Ihr Speicher als persistent markiert wird, ist das Speichern wichtiger Nutzerdaten. Idealerweise sollte die Anfrage in eine Nutzergeste eingebunden werden. Fordern Sie beim Laden der Seite oder in anderen Bootstrap-Code nicht nach dauerhaftem Speicherplatz. Andernfalls wird der Nutzer möglicherweise vom Browser um Erlaubnis gebeten. Wenn der Nutzer nichts tut, was seiner Meinung nach gespeichert werden muss, kann die Aufforderung verwirrend sein. In diesem Fall wird die Anfrage wahrscheinlich abgelehnt. Außerdem sollten Sie nicht zu oft auffordern. Wenn der Nutzer die Berechtigung nicht erteilt hat, sollten Sie ihn beim nächsten Speichern nicht sofort noch einmal um die Berechtigung bitten.

Nichtflüchtigen Speicher anfordern

Rufen Sie navigator.storage.persist() auf, um dauerhaften 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 dauerhaften 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 erteilt?

Der nichtflüchtige Speicher wird als Berechtigung behandelt. Browser verwenden verschiedene Faktoren, um zu entscheiden, ob persistente Speicherberechtigungen 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 den dauerhaften Speicher automatisch gewährt. Andernfalls wird sie stillschweigend abgelehnt.

Folgende Heuristiken können verwendet werden, um festzustellen, ob eine Website wichtig ist:

• Wie hoch ist die Interaktionsrate auf der Website?
• Wurde die Website installiert oder als Lesezeichen gespeichert?
• Wurde der Website die Berechtigung erteilt, Benachrichtigungen anzuzeigen?

Wenn der Antrag abgelehnt wurde, kann er später noch einmal gestellt werden. Er wird dann anhand derselben Heuristiken bewertet.

Firefox

Firefox delegiert die Berechtigungsanfrage an den Nutzer. Wenn nichtflüchtiger Speicher angefordert wird, wird der Nutzer in einem Pop-up auf der Benutzeroberfläche gefragt, ob er der Website erlaubt, Daten im nichtflüchtigen Speicher zu speichern.

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

Wenn die Berechtigung für den nichtflüchtigen Speicher erteilt wird, werden die folgenden Daten nicht vom Browser gelöscht:

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

Nichtflüchtigen Speicher deaktivieren

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

Fazit

Untersuchungen des Chrome-Teams haben gezeigt, dass gespeicherte Daten zwar automatisch von Chrome gelöscht werden können, dies aber selten geschieht. Um wichtige Daten zu schützen, die möglicherweise nicht in der Cloud gespeichert werden können oder zu erheblichen Datenverlusten führen, kann der nichtflüchtige Speicher ein hilfreiches Tool sein, damit Ihre Daten nicht vom Browser entfernt werden, wenn der lokale Speicherplatz knapp wird. Denken Sie daran, persistenten Speicher nur anzufordern, wenn der Nutzer ihn am ehesten benötigt.

Vielen Dank

Besonderer Dank geht an Victor Costan und Joe Medley für die Überprüfung dieses Artikels. Vielen Dank an Chris Wilson, der die ursprüngliche Version dieses Artikels verfasst hat, die zuerst auf WebFundamentals veröffentlicht wurde.

Hero-Image von Umberto auf Unsplash