最近、Service Workers というものを見つけました。これはユーザーの設定に基づいてウェブサイトの静的および動的なリソースをキャッシュすることができます。ユーザーのすべてのネットワークリクエストをキャプチャし、キャッシュの設定に基づいてリソースをキャッシュまたはネットワークから取得するかを決定するため、ウェブページの読み込み速度を大幅に向上させることができます。利点は高いカスタマイズ性、サーバーサイドのサポートが不要、効果が顕著です。
最終的な効果は、私のウェブサイトに 2 回目にアクセスすると、広告を除いて約 80k のリソースがロードされることです。これにはすべての画像とオーディオビデオが含まれており、この 80k は主に HTML と私が使用しているDPlayerの API です。
ネットワークが切断されている場合でもアクセスできます(ネットワークケーブルを切断して試してみてください):
もちろん、制約もあります:
HTTPS のみをサポートしています。ユーザーのネットワークリクエストをキャプチャするため、安全な環境が必要です。
互換性があまり良くありません。互換性レポートを確認すると、現在は Chrome、Firefox、Opera、および一部の Android ブラウザのみがサポートしています。
使用方法については、多くのチュートリアルがオンラインで利用可能ですので、ここでは省略します。以下の記事をおすすめします:
使用 service worker+sw-precache 实现网站加速