キャッシングと利点
ブラウザのキャッシュは一部のファイルを一時的に保存できるため、ページが切り替わったり同じページを再度読み込んだりしたときに、これらのファイルを再ダウンロードする必要はありません。サーバーはヘッダーを設定して、特定の期間内にこれらのファイルを保存するようブラウザーに指示できます。これにより、サイトの速度が大幅に向上するだけでなく、帯域幅も節約されます。
キャッシュの問題
ただし、開発者がサイトを変更すると、いくつかの問題が発生する可能性があります。一部のユーザーは、変更前のファイルに引き続きアクセスできます。これにより、これらのユーザーは以前の機能を使用したり、壊れたサイトにアクセスしたりします(サーバーによってレンダリングされたページ要素が削除、移動、または名前変更されると、キャッシュされたCSSおよびJavaScriptファイルはこれらの要素で動作します。エラー)
解決策
キャッシュを解決する鍵は、ブラウザに最新のファイルをダウンロードさせることです。これは、古いファイルに新しい名前を付けるか、サーバーヘッダーを変更するだけで済みます。
比較的単純で一般的に使用されている手法は、ファイルの最後にクエリ文字列を追加して、ブラウザに新しいファイルを再度ダウンロードさせることです。以下に示すように:
src="js/script.js"
src="js/script.js?v=2"
拡大する
- サーバーヘッダーがETagに設定されている
- サービスワーカーとキャッシュストレージ
- ウェブサイトの速度はSEOスコアに大きく影響します
- キャッシングとネーミングは、プログラミングにおける2つの主要な問題として歓迎されています
- webpackを使用するプロジェクトは、この問題をフレームワークレベルで自動的に解決しています。