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, aus der am weitesten in der Vergangenheit verwendeten Quelle. 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 viel häufiger, dass Nutzer den Speicherplatz manuell leeren. Wenn ein Nutzer Ihre Website also regelmäßig besucht, ist die Wahrscheinlichkeit gering, dass Ihre Daten entfernt werden. Damit der Browser Ihre Daten nicht löscht, können Sie anfordern, dass der gesamte Speicher Ihrer Website als dauerhaft gekennzeichnet 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 Speicher Ihrer Website als persistent gekennzeichnet ist

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?

Am besten fordern Sie die Markierung Ihres Speichers als persistent an, wenn Sie wichtige Nutzerdaten speichern. Die Anfrage sollte idealerweise in eine Nutzergeste eingebettet sein. 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 und er wird sie wahrscheinlich ablehnen. 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.

Die Heuristiken, mit denen festgestellt wird, ob eine Website wichtig ist, umfassen:

• 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 sandboxiertes 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, die diesen Artikel geprüft haben. 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 bei Unsplash