Permanentspeicher

Nichtflüchtiger Speicher kann dazu beitragen, wichtige Daten vor dem Entfernen zu schützen und das Risiko von Datenverlust zu verringern.

Pete LePage

Wenn der Speicherplatz knapp wird, entfernen Browser in der Regel Daten aus dem am wenigsten verwendeten Ursprung, einschließlich Daten aus der Cache API und IndexedDB. Dies kann zu Datenverlust führen, wenn die App keine Daten mit dem Server synchronisiert hat. Außerdem kann die Zuverlässigkeit der App beeinträchtigt werden, da Ressourcen entfernt werden, die für die Funktion der App erforderlich sind. Beides führt zu einer negativen Nutzererfahrung.

Glücklicherweise zeigen Untersuchungen des Chrome-Teams, dass Daten nur sehr selten automatisch von Chrome gelöscht werden. Viel häufiger löschen Nutzer den Speicher manuell. 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 Speicher Ihrer gesamten Website als nichtflüchtig markiert wird.

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

Weitere Informationen zum Entfernen von Daten, zur maximalen Speicherkapazität und zum Umgang mit Kontingent beschränkungen finden Sie unter Speicher für das Web.

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

Mit JavaScript können Sie prüfen, ob der Speicher Ihrer Website als nichtflüchtig markiert wurde. Wenn Sie navigator.storage.persisted() aufrufen, wird ein Promise zurückgegeben, das mit einem booleschen Wert aufgelöst wird, der angibt, ob der Speicher als nichtflüchtig 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 nichtflüchtigen Speicher anfordern?

Der beste Zeitpunkt, um anzufordern, dass Ihr Speicher als nichtflüchtig markiert wird, ist, wenn Sie wichtige Nutzerdaten speichern. Die Anfrage sollte idealerweise in einer Nutzeraktion verpackt sein. Fordern Sie nichtflüchtigen Speicher nicht beim Seitenaufbau oder in anderem Bootstrap-Code an, da der Browser den Nutzer möglicherweise um Erlaubnis bittet. Wenn der Nutzer nichts tut, was seiner Meinung nach gespeichert werden muss, kann die Aufforderung verwirrend sein und er wird die Anfrage wahrscheinlich ablehnen. Außerdem sollten Sie nicht zu oft dazu auffordern. Wenn der Nutzer die Berechtigung nicht erteilt hat, sollten Sie ihn beim nächsten Speichern nicht sofort wieder dazu auffordern.

Nichtflüchtigen Speicher anfordern

Wenn Sie nichtflüchtigen Speicher für die Daten Ihrer Website anfordern möchten, rufen Sie navigator.storage.persist() auf. Es wird ein Promise zurückgegeben, das mit einem booleschen Wert aufgelöst wird, der angibt, ob die Berechtigung für nichtflüchtigen Speicher erteilt 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 eine Berechtigung behandelt. Browser verwenden verschiedene Faktoren, um zu entscheiden, ob Berechtigungen für nichtflüchtigen Speicher erteilt werden sollen.

Chrome und andere auf Chromium basierende Browser

Chrome und die meisten anderen auf Chromium basierenden 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 erteilt. Andernfalls wird sie im Hintergrund abgelehnt.

Die Heuristiken zur Bestimmung, ob eine Website wichtig ist, umfassen:

• Wie hoch ist die Interaktionsrate auf der Website?
• Wurde die Website installiert oder mit einem Lesezeichen versehen?
• Wurde der Website die Berechtigung erteilt, Benachrichtigungen anzuzeigen?

Wenn die Anfrage abgelehnt wurde, kann sie später noch einmal gestellt werden. Sie wird dann mit denselben Heuristiken bewertet.

Firefox

Firefox leitet die Berechtigungsanfrage an den Nutzer weiter. Wenn nichtflüchtiger Speicher angefordert wird, wird der Nutzer in einem UI-Pop-up gefragt, ob er der Website erlauben möchte, Daten in nichtflüchtigem Speicher zu speichern.

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

Wenn die Berechtigung für nichtflüchtigen Speicher erteilt wird, entfernt der Browser keine Daten, die in folgenden Speichern 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
• Anwendungscache (verworfen, nicht verwenden)
• WebSQL (verworfen, nicht verwenden)

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 zeigen, dass gespeicherte Daten zwar automatisch von Chrome gelöscht werden können, dies aber nur selten geschieht. Nichtflüchtiger Speicher kann ein nützliches Tool sein, um wichtige Daten zu schützen, die möglicherweise nicht in der Cloud gespeichert sind oder zu erheblichem Datenverlust führen können. So wird verhindert, dass Ihre Daten vom Browser entfernt werden, wenn der Speicherplatz auf dem lokalen Gerät knapp wird. Denken Sie daran, nichtflüchtigen Speicher nur dann anzufordern, wenn der Nutzer ihn höchstwahrscheinlich benötigt.

Vielen Dank

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