HTTPキャッシュTTL / max-age計算ツール
ガイド
HTTPキャッシュTTL / max-age計算ツール
HTTP Cache-Controlヘッダーを視覚的に構築します。キャッシング戦略プリセットを選択するか、個々のディレクティブ(max-age、s-maxage、stale-while-revalidate、immutableなど)を設定します。人間が読める説明とCDN固有の同等物を含む、すぐに使用できるヘッダー文字列を取得します。
使用方法
一般的な設定を自動入力するためにプリセット(静的アセット、HTMLページ、APIレスポンス、CDNエッジキャッシュ)を選択するか、カスタムモードを使用してゼロからヘッダーを構築します。ディレクティブを切り替え、max-ageとs-maxageの時間値を設定すると、完全なCache-Controlヘッダー文字列が即座に生成されます。これをサーバー設定、.htaccess、またはアプリケーションコードに直接コピーします。
機能
- 戦略プリセット – 一般的なシナリオ(静的アセット:1年、immutable)、HTMLページ(リクエストごとに再検証)、APIレスポンス(private、no-cache)、CDNエッジキャッシング)のための事前設定済みの設定。
- すべてのCache-Controlディレクティブ – public、private、no-cache、no-store、max-age、s-maxage、stale-while-revalidate、stale-if-error、must-revalidate、proxy-revalidate、no-transform、immutableを設定します。
- 競合検出 – no-storeとmax-age、またはpublicとprivateの同時選択など、競合するディレクティブを選択した場合に警告します。
- 人間が読める時間表示 – 各時間入力の横にある秒数を可読形式(86400秒=1日)に自動的に変換します。
- ヘッダーの説明 – 設定したヘッダーが実際に行うことについて、平易な英語での説明を表示します。
- CDN固有ヘッダー – Cloudflare(CDN-Cache-Control)、Varnish/Fastly(Surrogate-Control)の同等のヘッダーを生成します。
- リアルタイム生成 – ディレクティブを切り替えたり値を変更したりすると、ヘッダー文字列が即座に更新されます。
このツールを使用するタイミング
Webアプリケーションのキャッシング設定、CDNキャッシュポリシーの設定、静的アセット配信の最適化、またはキャッシュ動作のデバッグ時にこのツールを使用します。RFC 7234仕様を記憶することなく、正しいCache-Controlヘッダーを構築する必要があるWeb開発者、DevOpsエンジニア、およびHTTPキャッシングを扱うすべての人にとって不可欠です。
よくある質問
-
Cache-Controlヘッダーとは何ですか?
Cache-Controlは、ブラウザやCDNに応答のキャッシュ方法を指示するHTTPヘッダーです。レスポンスがキャッシュ可能かどうか(public vs private)、キャッシュ可能な期間(max-age秒)、使用前に再検証が必要かどうか(no-cache、must-revalidate)、まったく保存しないかどうか(no-store)を制御します。Cache-Controlを正しく設定することは、利用可能な最も効果的なWebパフォーマンス最適化の1つです。
-
max-ageとs-maxageの違いは何ですか?
max-ageは、ブラウザキャッシュと共有(CDN/プロキシ)キャッシュの両方を含むすべてのキャッシュのキャッシュ有効期間を設定します。s-maxage(shared max-age)は、CDNやプロキシサーバーなどの共有キャッシュに対してmax-ageを具体的にオーバーライドしますが、ブラウザは引き続きmax-ageを使用します。これにより、異なるキャッシュ期間を設定できます。たとえば、max-age=60(ブラウザは1分間キャッシュ)とs-maxage=86400(CDNは1日間キャッシュ)です。これは、時々変更されるコンテンツによく使用されるパターンです。
-
stale-while-revalidateは何をしますか?
stale-while-revalidateは、キャッシュがバックグラウンドで新しいレスポンスを取得しながら、古い(期限切れの)レスポンスを提供できるようにします。たとえば、stale-while-revalidate=86400は、キャッシュが非同期で再検証しながら、最大1日間期限切れのレスポンスを提供できることを意味します。これにより、ユーザーは再検証を待つ必要がなくなり、知覚パフォーマンスが劇的に向上します。即時(わずかに古い)レスポンスが得られ、キャッシュは次のリクエストのために自己更新されます。
-
no-cacheとno-storeの違いは何ですか?
no-cacheは「キャッシュしない」という意味ではありません。それは「レスポンスをキャッシュするが、使用前に常にサーバーで再検証する」という意味です。ブラウザはレスポンスを保存しますが、提供する前にサーバー(ETagまたはLast-Modified経由)にチェックします。コンテンツが変更されていない場合、サーバーは304 Not Modifiedで応答し、キャッシュされたバージョンが使用されます。no-storeは「まったくキャッシュしない」という意味です。レスポンスはどのキャッシュにも保存してはいけません。変更される可能性はあるが条件付きリクエストが役立つコンテンツにはno-cacheを使用し、永続化すべきでない機密データにはno-storeを使用します。
恵 スコアボードが到着しました!
スコアボード ゲームを追跡する楽しい方法です。すべてのデータはブラウザに保存されます。さらに多くの機能がまもなく登場します!
