Domain 77 / 225
Dynamic Rendering は非推奨、SSR / 静的レンダリングへの移行が公式推奨
Dynamic Rendering の要点
Dynamic Rendering はかつて JavaScript SPA の SEO ワークアラウンドだったが、Google は現在「短期的な解決策」と位置づけ、SSR や静的レンダリング、Hybrid Rendering（ハイドレーション）への移行を推奨。新規実装は SSR が第一選択
なぜこれを学ぶか
Dynamic Rendering は 2018-2022 頃に JavaScript SPA の SEO 救済策として推奨されていたが、現在は非推奨。 今もネット上には古い記事が多く、間違って Dynamic Rendering を新規実装してしまう案件がある。
JavaScript フレームワーク（React / Vue / Angular）のサイト改修時に重要。
学ばないと起きること
| よくある事故 | 被害 |
|---|---|
| 古いブログを参考に Dynamic Rendering を新規実装 | メンテ負担増・公式非推奨 |
| Bot 検出が漏れて User と Bot で別コンテンツを返す | クローキング判定リスク |
| Dynamic Rendering 用のサーバが止まり SEO が壊れる | 検索結果から消える |
学ぶメリット
- 古い情報に流されず正攻法（SSR / 静的）を選択
- 既存 Dynamic Rendering 案件を SSR 移行できる
- 商談で「Dynamic Rendering は短期的回避策」を即答
仕組み
Dynamic Rendering とは
User-Agent を見て:
- ユーザーには JS で動的レンダリングされる SPA を返す
- Bot（Googlebot 等）には事前レンダリング済み HTML を返す
Prerender.io / Rendertron などのサービスで実現。
Google が非推奨に転じた理由
公式: "Dynamic Rendering is a workaround and not a long-term solution."
- Googlebot の JS レンダリング能力が向上、必須でなくなった
- 2 系統のサーバ管理が複雑
- 同期が崩れるとユーザーと Bot で表示が乖離（クローキング扱い）
推奨される代替
| 方式 | 特徴 |
|---|---|
| SSR（Server-Side Rendering） | サーバで HTML 生成、ユーザー / Bot 両方に返す |
| 静的サイト生成 | ビルド時に HTML 生成、最高速 |
| Hydration（Hybrid） | 初回 SSR + クライアントで JS 実行 |
Next.js / Nuxt / SvelteKit / Remix が標準対応。
キー概念
クローキング判定リスク
User と Bot で異なるコンテンツを返すのは クローキング。 Dynamic Rendering は「同じコンテンツを違う方法で配信」が前提だが、実装ミスで内容が乖離するとペナルティ対象。
Googlebot の JS 対応状況
- Chromium ベース（最新 Chrome 相当）
- ES2019+ サポート
- WebAssembly / IndexedDB 対応
- ただしクロールバジェット消費が JS で増大
よくある誤解
| よくある誤解 | 実際のところ | 出典 |
|---|---|---|
| Dynamic Rendering は SPA の正解 | 非推奨、SSR / 静的が推奨 | Dynamic Rendering（非推奨） |
| Dynamic Rendering はクローキングではない | 実装ミスでクローキング判定リスクあり | 同上 |
| Googlebot は JS を実行しない | 実行する、ただし遅延・コスト高 | JS SEO 基礎 |
実務での適用
既存 Dynamic Rendering の SSR 移行
- Next.js / Nuxt 等の SSR フレームワークに移行
- 段階的に Prerender 削除
- Search Console で順位 / インデックス変動モニタリング
新規 SPA 案件
最初から SSR / 静的サイト生成を選択。
トラブル別の対処
| 症状 | 確認すべきこと |
|---|---|
| SPA で SEO 流入が伸びない | SSR / 静的への移行検討 |
公式ソース
自己テスト
Q1. Dynamic Rendering の現在のステータスは？
Google 公式で「短期的な回避策」と位置づけられ、SSR / 静的レンダリングへの移行が推奨
Q2. Dynamic Rendering の代替の第一選択は？
SSR（Next.js / Nuxt / SvelteKit など）または静的サイト生成
Q3. Dynamic Rendering でクローキング判定されるリスクは？
User と Bot で表示内容が実装ミスで乖離した場合
これらの内容を採点付きで挑戦したい場合は、本ドメインのプロ試験で 5 問形式で確認できる。