Nichtflüchtiger Speicher kann dazu beitragen, kritische Daten vor der Bereinigung zu schützen und das Risiko eines Datenverlusts zu verringern.
Bei Speichermangel wie wenig Speicherplatz entfernen Browser Daten, einschließlich aus der Cache API und IndexedDB, aus dem am wenigsten verwendeten Ursprung. Dies kann zu Datenverlusten führen, wenn die App keine Daten mit dem Server synchronisiert hat, und die Zuverlässigkeit der App verringern, indem Ressourcen entfernt werden, die für das Funktionieren der App erforderlich sind. Beides kann sich negativ auf die Nutzererfahrung auswirken.
Glücklicherweise haben Untersuchungen des Chrome-Teams ergeben, dass Daten 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.
Nichtflüchtiger Speicher wird in vielen modernen Browsern unterstützt.
Weitere Informationen zur Bereinigung, dazu, wie viel Sie speichern können und wie mit Kontingentbeschränkungen umgegangen wird, finden Sie unter Speicher 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 markiert wurde. Der Aufruf von navigator.storage.persisted()
gibt ein Promise zurück, das mit einem booleschen Wert aufgelöst wird, der angibt, ob der Speicher als persistent 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 dauerhaften Speicher bitten?
Am besten fordern Sie die Kennzeichnung Ihres Speichers als persistent an, wenn Sie wichtige Nutzerdaten speichern. Idealerweise sollte die Anfrage in eine Nutzergeste eingebunden werden. Fragen Sie nicht nach dauerhaftem Speicher beim Seitenaufbau oder in anderen Bootstrap-Code, da der Browser den Nutzer möglicherweise um Berechtigung bittet. 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 häufig auffordern. Wenn der Nutzer die Berechtigung nicht erteilt hat, fordern Sie beim nächsten Speichern nicht sofort wieder eine Aufforderung an.
Nichtflüchtigen Speicher anfordern
Rufen Sie navigator.storage.persist()
auf, um dauerhaften Speicher für die Daten Ihrer Website anzufordern. Es 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 erteilt?
Nichtflüchtiger Speicher wird als Berechtigung behandelt. Browser verwenden unterschiedliche Faktoren, um zu entscheiden, 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 erachtet wird, wird die Berechtigung für den nichtflüchtigen Speicher stattdessen automatisch gewährt. Andernfalls wird sie ohne Rückmeldung verweigert.
Folgende Heuristiken können verwendet werden, um festzustellen, ob eine Website wichtig ist:
- Wie hoch ist das Interesse an der Website?
- Wurde die Website installiert oder als Lesezeichen gespeichert?
- Wurde der Website die Berechtigung zum Anzeigen von Benachrichtigungen gewährt?
Wenn die Anfrage abgelehnt wurde, kann sie später noch einmal angefordert werden und wird mit derselben Heuristik bewertet.
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.](https://web.developers.google.cn/static/articles/persistent-storage/image/a-popup-shown-firefox-a-c1a6b170da587.jpg?authuser=6&hl=de)
Welcher Speicher wird durch nichtflüchtigen Speicher geschützt?
Wenn die Berechtigung für nichtflüchtigen Speicher gewährt wird, entfernt der Browser keine Daten, die an folgenden Orten gespeichert sind:
- Cache-API
- Kekse
- DOM-Speicher (lokaler Speicher)
- File System API (vom Browser bereitgestelltes und in einer Sandbox ausgeführtes Dateisystem)
- IndexedDB
- Service Worker
- App-Cache (eingestellt, 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 nichtflüchtigen Speicher mehr benötigen.
Fazit
Untersuchungen des Chrome-Teams haben gezeigt, dass gespeicherte Daten selten automatisch von Chrome gelöscht werden, obwohl dies möglich ist. Zum Schutz kritischer Daten, die nicht in der Cloud gespeichert werden oder zu erheblichen Datenverlusten 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 mit Speichermangel konfrontiert ist. Denken Sie außerdem daran, nichtflüchtigen Speicher nur dann anzufordern, wenn der Nutzer ihn am wahrscheinlichsten möchte.
Danke
Unser besonderer Dank gilt Victor Costan und Joe Medley für die Rezension dieses Artikels. Danke an Chris Wilson, der die Originalversion dieses Artikels verfasst hat, der erstmals bei WebFundamentals erschienen ist.
Hero-Image von Umberto auf Unsplash