web-dev-qa-db-ja.com

Service Worker Cache APIと通常のブラウザーキャッシュの違いは何ですか?

プログレッシブウェブアプリでは、静的アセットのService WorkerでキャッシュAPIを使用する必要がありますか、それともブラウザーのネイティブキャッシュコントロールに依存する必要がありますか?違いは何ですか?

50
Joe Marini

Service WorkerキャッシュAPIの主な利点は、組み込みのブラウザーキャッシュよりも詳細に制御できることです。たとえば、Service Workerは、ユーザーが最初にWebアプリを実行したときに、まだアクセスしていないアセットを含む複数のリクエストをキャッシュできます。これにより、後続のリクエストが高速化されます。独自のキャッシュ制御ロジックを実装して、使用頻度の低いデータを削除しながら、重要と見なされるアセットをキャッシュに保持することもできます。

26
Joe Marini

主な違いはコントロールです。ブラウザのキャッシュは、それがうまくいかないまでは、Cache-Controlヘッダーから追い出されます。ネットワークアドレス可能なリソースがどのようにキャッシュされるかを管理するためのあらゆる種類の戦略があります。プライベート、パブリック。生きる時間など.

Service Workerキャッシングを使用すると、これらのアセットを永続化する方法をプログラムで制御できます。しかし、それはあなたに負担がかかっていることを意味します。

ブラウザのキャッシュは、私が信頼できないと考えるものです。ブラウザは、デバイスのストレージの可用性に基づいてアセットを自動的に削除します。たとえば、iPhoneは以前は25kbを超えるリソースのキャッシュを無視していました。今日、彼らは非常に攻撃的だと思います。

Facebookチームが数年前に調査を行ったところ、ブラウザがヘッダーに基づいてキャッシュすることを期待していたファイルの25%しかキャッシュされていなかったことを知っています。これは、余分なネットワークトラフィックとサーバーアクティビティがあったことを意味します。

これが、Service Workerキャッシングの方が適している理由です。キャッシュヘッダーを削除しないでください。それらに頼らないでください。

17
Chris Love