In meiner Progressive Web App, sollte ich die Cache-API in einem Service-Worker für meine statischen Assets verwenden, oder sollte ich mich nur auf die native Cache-Steuerung des Browsers für diese verlassen? Was ist der Unterschied?Was ist der Unterschied zwischen der Verwendung der Service-Worker-Cache-API und dem regulären Browser-Cache?
Ein großer Vorteil der Service-Worker-Cache-API besteht darin, dass sie eine detailliertere Kontrolle als der integrierte Browser-Cache bietet. Beispielsweise kann Ihr Service-Mitarbeiter mehrere Anforderungen zwischenspeichern, wenn der Benutzer Ihre Web-App zum ersten Mal ausführt, einschließlich der Assets, die sie noch nicht besucht haben. Dies wird nachfolgende Anfragen beschleunigen. Sie können auch eine eigene Logik zur Cache-Steuerung implementieren, um sicherzustellen, dass Assets, die als wichtig erachtet werden, im Cache verbleiben, während weniger verwendete Daten gelöscht werden.
Der Hauptunterschied ist die Kontrolle. Der Browser-Cache wird von den Cache-Control-Headern abgefangen, was gut ist, bis nicht. Es gibt alle möglichen Strategien, um zu verwalten, wie netzwerkadressierbare Ressourcen zwischengespeichert werden. private Öffentlichkeit; Zeit zum Leben usw.
Mit dem Zwischenspeichern von Service-Arbeitern können Sie programmgesteuert steuern, wie diese Elemente beibehalten werden. Aber das bedeutet, dass die Last auf dich wirkt.
Browser-Cache ist, was ich als unzuverlässig betrachte. Der Browser bereinigt automatisch die Ressourcen basierend auf der Verfügbarkeit des Gerätespeichers. Zum Beispiel, iPhones ignoriert Caching für jede Ressource über 25kb. Heute denke ich, dass sie nur sehr aggressiv sind.
Ich weiß, dass das Facebook-Team vor ein paar Jahren eine Studie durchgeführt hat und nur 25% der Dateien gefunden hat, die die Browser aufgrund von zwischengespeicherten Headern cachen sollten. Dies bedeutete, dass es zusätzlichen Netzwerkverkehr und Serveraktivität gab.
Aus diesem Grund ist Service-Worker-Caching die bessere Wahl. Entfernen Sie nicht Ihre Cache-Header, sondern lehnen Sie sich nicht an sie.
Ein Kommentar, der sich darauf bezog. Wenn Cache-Header zum Zwischenspeichern von Elementen auf einer Seite verwendet werden, wird der HTTP-Cache vom Browser übersprungen. SW fetch Event wird immer eine Anfrage abfangen, was bedeutet, dass Sie immer aus Ihrem Cache bedienen können, wenn Sie möchten. –
@GauntFace In der Tat, und es ist nicht nur auf eine explizite "Aktualisierung" einer geöffneten Registerkarte. Eine implizite "Aktualisierung" wie das Laden der Seite in eine neue Registerkarte schlägt fehl, wenn die Seite mit Kopfzeilen zwischengespeichert wurde und das Gerät offline ist. –