静的マーケサイトが「速い」と感じられるのは、次のクリックがすでにウォームアップされているときだ。Speculation Rules APIは HTML のそばに JSON ポリシーを添付し、ブラウザが将来のナビゲーションを prefetch／条件次第で prerender できるようにする。クラシックなマルチページ構成のまま、クライアントサイドルータを無理に足さなくてよい。2026年の現場問いは「ヒントできるか」ではなく「Content-Security-Policy を破らず、CDN 課金を二倍にせず、ユーザー可視状態を書き換えるページを prerender しないには？」である。本稿では数値ガードレール、意思決定表、そして Chromium とスケジューリングの異なる Apple Silicon Safari でのリハーサルをまとめる。
合わせて SRI・CDN・CSP を読んでほしい。投機ヒントは CSP が統治するオリジンを踏むからだ。また レスポンシブ画像と LCP も参照し、コールドナビゲーションで巨大ヒーローが優先されないよう資産サイズを抑える。
投機ルール JSON の要点
レイアウトの最初の数 KB に <script type="speculationrules"> を置き、ブラウザが貪欲にパースする JSON を載せる。各ルール集合は 適用条件（どの文書で推測してよいか）、ターゲット URL、積極度（prefetch か prerender か）を宣言する。テンプレート各处に散らばった link rel=prefetch より、Git で diff しやすくオーナーを割り当てやすい。
主要コンバージョン経路が 12 本以内に収まるチームほど効果が出やすい。ヒント数に上限を付け、キャッシュヒートを明示的に設計できる。各ヒント URL はミニリリースだと考えよ：投機取得と通常ナビの二重取得に耐え、二重計上されないビーコン設計が必要。
多言語サイトでは、フランス語ヒントが英語料金へ飛ぶのが典型事故だ。各ロケールディレクトリごとにルール断片を複製し、hreflang と矛盾させない。検索と投機ポリシーの両方が同じ地図を見ているかレビューに入れる。
ドキュメントルールとリストルール
ドキュメントルールは現在の URL やリファラなどの述語に基づき推測する。キャンペーンクエリでバケット分割するマーケサイトと相性が良い。リストルールは URL を列挙し、フッターグリッドの「どのページにも同じ12リンク」と相性が良い。併用時は優先順位を先に決めろ：モバイルではドキュメントルールで目的地を絞り、デスクトップのリストでわずかに広げる、など。
善意のコントリビュータが二つ目の speculationrules スクリプトを足してヒントが静かに倍増するのを防ぐため、ルールは単一の注入ポイントに集約し、パフォーマンスハンドブックに裁決を書く。
prefetch と prerender のマトリクス
prerender を有効にする前に表を埋める。数値は 2026年の静的サイト監査で使う保守的スタート地点であり、CDN ログで必ず調整すること。
| ヒント種別 | CPU コスト | アナリティクスリスク | 初週キャップ例 | 狙いどころ |
|---|---|---|---|---|
| Prefetch（ドキュメント） | 低 | 低（ナビ去重前提） | 並行 4 | 料金、ドキュメント索引、変更履歴 |
| Prefetch（リスト） | 低〜中 | 中（ビーコン厳格ベンダー） | ページあたり 6 URL | フッターハブ、ロケール切替 |
| Prerender | 高 | 高（JS 実行） | モバイル 1、デスクトップ 2 | 匿名ファネルのみ |
Prerender は LCP を消し去るように見えるが、サードパーティ A/B が二重実行されたりリードピクセルが二重発火したりする。localStorage 書き込み、OAuth コールバック、パーソナライズドヒーローがあるページは、副作用をナビゲーションゲートの背後に移すまで prefetch のみに留める。
同意バナーやチャットウィジェットを抱えるサイトでは、ユーザーが操作する前に SDK が初期化されるとコンプライアンス上まずい。そうしたスクリプトはインタラクション後または実ナビ後に遅延させる設計へ。
CSP・資格情報・crossorigin
Prefetch も Content-Security-Policy に従う。connect-src に動的モジュール JSON の CDN を忘れると、ルールは失敗クローズだ。ヒントされた各オリジンを script-src、必要なら img-src／font-src に写し、前述の SRI／nonce 記事と整合させる。
SameSite=Lax セッションと prerender を混ぜると、ストレージに奇妙なゴースト状態が残ることがある。公開ページでは匿名制約を優先し、認証アプリは別レジスタラブルドメインへ分離して prerender を意図的に遮断し、監査ログに理由を残す。
アイコンフォントや計測エンドポイントも connect-src に含める。HTML 直読み資源だけ見てヒント連鎖を見落とすチームが多い。
単純ロールアウトを捕まえる指標
ヒントを入れた最初の 7 日間は、(1) セッションあたり出口 GB、(2) ヒント消費ナビの中央値 LCP、(3) 送信ページの INP（投機作業がメインスレッドを奪う）、(4) 先読みトラフィックで跳ね上がる下流 API エラー率、を追う。健全な例では egress +3〜8%、ヒント経路 LCP は 150〜400ms 改善が目安。egress が二桁ならキャップとメディア重量を疑え。
RUM で「ヒント命中」をブール化し、偶然のプリフェッチヒットとコールドロードを分離しないと、コンバージョン改善を過大評価して四半期計画が歪む。
キャッシュキーや Service Worker を同時にいじる場合は、ルール断片のバージョンを README に結び付け、古いクライアントが奇妙な鋸齒を出すのを防ぐ。
Safari／WebKit リハーサル
Chromium が先行しても、macOS 比率の高いオーディエンスでは Safari が署名権を持つ。未対応／部分対応は 漸進的拡張：HTML は正しく、計測はヒント欠落に耐性があり、CSP はヒントが無視されても厳格のまま。
専用の Apple Silicon Mac mini で安定 Safari と必要ならピン留め WebKit Technology Preview を回せ。ネットワーク品質推定やキャッシュパーティションは Linux CI エージェントと異なる。ホバー密集 UI の後の初回ナビを画面録画し、Windows 開発機とは異なる合流更新を確認する。
新しい述語を使うポリシーなら、リリースチェックリストに「WebKit ナイトリー合格」「安定版のフォールバック」を明記し、実験機能を契約のように扱わない。
静的 MPA 向けドロップインパターン
手書き静的出力では単一 JSON 断片をレイアウト partial に同居させ、ビルド時データでロケール接頭辞やキャンペーン slug を差し替える。翻訳者が CSP センシティブ URL を誤フォークしにくい。モバイルシェルでは gzip 後 2KB 未満を目安にし、ヒーロー HTML と第1 RTT を奪い合わない。
コンポーネント境界で静的ルートを分割している場合、各ルートへ二重注入しないガードを CI に置く。プリレンダ API ルートと純静的ルートでヒント密度を別ダッシュボード化するとインシデント後の切り分けが速い。
組織的には、並行上限を上げる PR には直近1週間の CDN／RUM キャプチャを添付し、デモ用にサイト全体をブロードキャストしない文化を固定する。
FAQ
Speculation Rules は link rel=preload を置き換える？
いいえ。preload は 現在のページのクリティカルサブリソース向け。投機ルールは 将来のナビを最適化する。開いているページのヒーローには引き続き preload／fetchpriority が要る。
認証済みダッシュボードへ prerender は安全？
一般に危険。JS が走る。匿名シェルへ分離できるまでダッシュボードは prerender 対象にしない。
2026年時点で Safari は？
進化中。継続テストし Chromium とのparity を仮定しない。未対応でも一流体験を届ける。
同時 prefetch は？
モバイルはまず 2〜4 並行。週次で CDN／RUM を見てから増やす。
投機ルールの本番運用は結局オペレーション問題だ。実機 Safari、十分なユニファイドメモリ、devtools と録画を同時に回せるマシンが要る。MacHTML の クラウド Mac mini なら1日あたり約16.9ドルでその参照環境を手に入れ、誤った prerender ポリシーの後始末に費やす週を買い戻せる。Apple Silicon は持続的 prefetch 負荷でも静音で、利害関係者の実機と同じ TCC／ネットワークスタックを踏める。
弾性レンタルなら、投機ルールスプリントの間だけ WebKit 検証ホストを立ち上げ、指標が平坦化したら解体できる。資本支出も倉庫の遊び金属も不要で、Safari スケジューラを Linux コンテナが嘘つくファイルロックで模倣する必要もない。
実機 Safari で Speculation Rules をリハーサル
クラウド Mac mini を借りて、prefetch 上限・prerender 安全性・CSP 整合を Apple Silicon で確かめてから本番トラフィックへ。