ブラウザの「戻る」ボタンを押したとき、ページが一瞬で表示される場合とそうでない場合があります。この差はブラウザキャッシュの効き方によるものですが、自分のサイトでどの程度キャッシュが活用されているかを把握する手段は限られていました。
2026年4月30日、Cloudflare Web Analyticsに「Navigation Type」フィルタリングが追加されました。ユーザーがどのようにページに到達したか（リンククリック、リロード、戻る/進む）と、そのときブラウザキャッシュが使われたかどうかをダッシュボード上で確認できます。
この記事でわかること
- Navigation Typeフィルタリングの概要と9種類のナビゲーションタイプ
- キャッシュが効いていないパターンの見つけ方
- bfcache・プリフェッチの最適化に活かすポイント
Navigation Typeフィルタリングとは
Cloudflare Web Analyticsは、JavaScriptビーコンでリアルユーザーモニタリング（RUM）データを収集する無料の解析ツールです。訪問者の個人データを収集しないプライバシー重視の設計で、Cloudflareアカウントがあればすぐに導入できます。
今回追加されたNavigation Typeフィルタリングは、HTMLドキュメントの読み込み方法を分類して記録する機能です。ページの読み込みを「ナビゲーション（リンククリックやフォーム送信）」「リロード」「戻る/進む」の3カテゴリに分け、それぞれでブラウザキャッシュが使われたかどうかを可視化します。
なぜナビゲーションタイプの把握が重要か
Webサイトの表示速度を改善するとき、CDNのキャッシュヒット率はよく確認されます。一方で、ブラウザ側のキャッシュがどの程度機能しているかは見落とされがちです。
ユーザーが「戻る」ボタンでページに戻ったとき、bfcache（Back/Forward Cache）が効いていれば瞬時に表示されます。効いていなければネットワークリクエストが発生し、ページの再読み込みが必要です。同じ操作でも体感速度がまったく異なるため、キャッシュが効いていない箇所を特定する手段が求められていました。
Navigation Typeフィルタリングでは「Back-forward」と「Back-forward Cache」の比率を見るだけで、bfcacheの効果を定量的に判断できます。
9種類のナビゲーションタイプ
記録されるナビゲーションタイプは9種類で、大きく4つのカテゴリに分かれます。
通常のナビゲーション（リンククリック・フォーム送信）
- Navigate — キャッシュなし。ネットワーク経由でドキュメントを取得
- Navigate Cache — HTTPキャッシュからドキュメントを取得
- Navigate Prefetch Cache — プリフェッチ済みキャッシュからドキュメントを取得
- Prerender — ブラウザが事前レンダリング済み。ネットワークリクエスト不要
リロード
- Reload — キャッシュなし。ネットワーク経由でドキュメントを取得
- Reload Cache — HTTPキャッシュからドキュメントを取得
戻る/進む
- Back-forward — キャッシュなし。ネットワーク経由でドキュメントを取得
- Back-forward Cache — bfcacheまたはHTTPキャッシュからドキュメントを取得
その他
- Restore — 非アクティブだったタブをブラウザが復元
各カテゴリ内で「キャッシュあり」と「キャッシュなし」がペアになっています。ペアの比率を比較すれば、どの操作でキャッシュが活用されていないかがすぐにわかります。
ダッシュボードでの使い方
Navigation Typeフィルタは、Cloudflare Web Analyticsのダッシュボードから利用できます。フィルタ条件は「equals」「does not equal」「in」「not in」の4種類です。
ナビゲーションタイプごとの内訳を見るには、サイドバーの「Page views」を選択してページ下部までスクロールします。特定のタイプだけに絞り込むこともでき、たとえば「Back-forward」のみを表示してbfcacheが効いていないページを特定する、といった使い方ができます。
キャッシュ改善の手がかり
Navigation Typeのデータから、具体的な改善アクションにつなげられます。
bfcacheの改善：「Back-forward」の割合が「Back-forward Cache」より大幅に高い場合、bfcacheを無効化している要因が疑われます。unloadイベントリスナーやCache-Control: no-storeヘッダーが代表的な原因です。web.devのbfcacheガイド（参考）に対処法がまとまっています。
プリフェッチの導入：「Navigate」が大半を占めている場合、<link rel="prefetch">やSpeculation Rules APIを使ったプリフェッチ・プリレンダリングの導入で、「Navigate Prefetch Cache」や「Prerender」の比率を上げられます。
リロード頻度の監視：「Reload」の比率が高い場合、サイトの安定性に問題がある可能性があります。エラーページやJavaScriptのクラッシュが原因で、ユーザーがリロードを繰り返しているケースが考えられます。
まとめ
Navigation Typeフィルタリングは、Cloudflare Web Analyticsの無料プランで利用できます。導入にあたって追加の設定は不要で、既にCloudflare Web Analyticsのビーコンを埋め込んでいるサイトではダッシュボードからすぐに確認できます。ブラウザキャッシュの最適化はCore Web Vitalsの改善にも直結するため、表示速度を重視するサイト運営者にとって有用な機能です。