NEXT.JS、ASTRO、WORDPRESS IN 2026

React、コンテンツファースト型フレームワーク、そして依然として支配的な CMS にまたがる実践的なエージェンシー判断フロー。毎週これら3つすべてを本番運用している視点から。

NEXT.JS、ASTRO、WORDPRESS IN 2026
Next.js とヘッドレス構成 ピラー 23 分で読めます 更新 2026年7月24日

← ガイド一覧 このトピックの全ガイド

このページの内容
  1. ほとんどのチームが判断を誤る点
  2. 2026年における各プラットフォームの実態
  3. Next.jsが正しい答えになるとき
  4. Astroが正しい答えになるとき
  5. WordPressがまだ正しい答えである場合
  6. ヘッドレスWordPressが正しい選択肢である場合
  7. レンダリング戦略の決定
  8. CMS レイヤーの決定(ヘッドレスの場合)
  9. ホスティングと価格の現実
  10. チームフィットの問題
  11. パフォーマンス:各プラットフォームが実際に提供するもの
  12. 3 つのオプション全体の SEO 姿勢
  13. マイグレーション経済学
  14. 私の正直な意思決定ツリー
  15. 要点

ほとんどのチームが判断を誤る点

Next.js、Astro、WordPress の3つの選択肢
流行のフレームワークではなく、チーム、コンテンツの形、失敗モードにマッチしたレーンを選べ。

Next.js、Astro、WordPress のどれを選ぶか——これは起業家やエージェンシークライアントから最も頻繁に受ける質問です。答えはほぼ常に彼らの予想と異なります。この判断は「フレームワーク対フレームワーク」ではありません。判断軸は「インテント」です。実際に何を構築しているのか、ローンチ後は誰が保守するのか、そして最も避けたい失敗モードは何か。この3つに正直に向き合えば、フレームワークの選択は自ずと決まります。

以下は、12年間にわたり3つすべてを本番運用してきたオペレータからの視点です。Seahawk Media では毎週 WordPress、Next.js、Astro を実行していますが、多くの場合、同じクライアント案件の異なるライフサイクル段階で使い分けています。いずれも本当に優れたソフトウェアです。いずれも特定の状況では間違った答えになります。このガイドはマーケティングページのツアーではなく、私が実際に使っている判断フローです。

2026年における各プラットフォームの実態

Next.js

Next.jsはReactフレームワークであり、サーバーレンダリング層、ファイルシステムルーティング、静的HTML、サーバーレンダリングHTML、またはその中間を生成するビルドシステムを備えています。AppRouterモデルはバージョン15以降安定し、React Server Componentsがデフォルトとなり、このフレームワークはグリーンフィールドReactプロジェクトの主流な選択肢です。Vercelが提供し、NetlifyとCloudflareが実行し、エコシステムは非常に広大です。

Astro

Astroはコンテンツファーストのフレームワークで、デフォルトではJavaScriptを一切出荷せず、インタラクティビティが必要な場所にのみReact、Vue、Svelte、またはSolidコンポーネントを追加できます。その得意分野はコンテンツサイト、マーケティングページ、ブログ、ドキュメント、パンフレットサイトです。メンタルモデルは「デフォルトではHTML、必要な箇所ではJS」で、これはすべてがJavaScriptであることを前提とするReactの仮定を逆転させています。

WordPress(クラシックおよびヘッドレス)

WordPressはPHPで動作し、MySQLデータベースに存在し、ウェブ上で最大のプラグインエコシステムを持っています。2026年現在、WordPressは2つの運用モードを持ちます。クラシック(WordPressがバックエンドとフロントエンド両方をレンダリング)とヘッドレス(WordPressがAPIおよびCMS役割を果たし、Next.js、Astro、またはNuxtがレンダリングを処理)です。ヘッドレスWordPressは、エディターを使うWordPressの世界とエンジニアを使うNext.jsの世界を橋渡しするものです。

Next.jsが正しい答えになるとき

Next.jsはプロダクト型サイトに勝ります。具体的には、チームがReactに精通しており、プロダクトが一般的なマーケティングサイトを超えたステートフルなインタラクティビティを持ち、データモデルがカスタムであり(一般的なブログやCMSではない)、エンジニアリングチームが長年にわたってコードベースを所有するという場合です。

実際に出荷した仕事の具体例:マーケティングフロントドア付きのSaaS ダッシュボード、ログインとパーソナライズされたコンテンツを備えたマーケットプレイス、深くカスタマイズされたデモを備えた開発者ツール企業のサイト、HostList.ioのような マルチテナントディレクトリプラットフォーム。これらのすべてがReact Server Components、Next.jsのデータフェッチングプリミティブ、および同じフレームワーク下での静的マーケティングページと認証付きアプリサーフェス間のスムーズなトランジションの恩恵を受けている。

Next.jsが急速にコストが高くなるのは、非技術的なエディターを持つコンテンツが多いサイトです。CMS統合は常にカスタムであり、編集ワークフローは常に再構築され、それを維持するチームは永続的にエンジニアリング人員を配置する必要があります。編集チームが3人のライターで、エンジニアの関与なしに公開したいのであれば、Next.jsは間違った戦いをしています。

重要なポイント:Next.jsは、実際のステート管理が必要で、複数年にわたってエンジニアチームが保有・運用するプロダクトに適している。

Astroが正しい答えになるとき

Astroはコンテンツ重視のサイト、特に強いデザイン言語とクリーンなコンポーネントを配信する能力を備えたエンジニアリング体制があるサイトに最適です。具体的には、マーケティングサイト、ドキュメンテーションハブ、パンフレットサイト、ポートフォリオ、エージェンシーサイト、パフォーマンスがブランドの一部であるブログといった用途です。訪問者体験が読むまたはスキャニングであり、ステートフルなフローとのインタラクションではないサイトの種類です。

本サイト gautamkhorana.com はAstroで構築されています。2026年のデザイン重視のエージェンシーや個人プロダクトローンチの多くのマーケティングサイトも同じです。論理は単純です。デフォルトJavaScriptがゼロということは、Lighthouseのスコアが楽々100になり、コンテンツモデルがプレーンなマークダウンまたはSanityまたはSupabaseであり、ビルドパイプラインが任意のCDN上で無限トラフィックに耐える静的HTMLを生成します。私がAstroで配信したサイトは、ローンチ以来、パフォーマンスリグレッションがまったくありません。少数ではなく、ゼロです。

Astroが間違った選択肢となる場合、それは大規模な認証済みユーザーステート、フロントエンド複雑性がコンテンツ複雑性をはるかに上回る場合、またはチームがコードベース全体でReactイディオムに移行する必要がある場合です。Astroは軽量であることに優れていますが、重いプロダクトを構築するには間違ったツールです。

重要なポイント:Astroは、訪問者の主な目的が読むことであり、デフォルトでJavaScriptをゼロにすることがブランドの一部である場合に適している。

WordPressがまだ正しい答えである場合

WordPressはエディタ体験がレンダリングパフォーマンスよりも重要なコンテンツ主導型サイト、プラグインエコシステムが実際の問題を解決するサイト、および継続的なエンジニアリング体制を配置しないチーム向けに勝ちが確定する。/guides/wordpress/の柱で完全に詳しく説明されている;短いバージョン:ノンテクニカルエディタがいる場合、プラグイン使用が重要であり、3年間の総所有コストが決定指標であれば、WordPressはコンテンツ主導型サイトの大多数に対して依然として正しい答えである。

具体的には、定期的な編集更新を伴うパンフレットサイト、地域の複雑な税務処理をWooCommerceが解決するeコマースサイト、MemberPressまたはRestrict Content Proがワークフローをすぐに提供するメンバーシップサイト、ニッチなプラグインがモデルの90%を処理する不動産またはジョブボードサイト、クライアントが今後の変更にデベロッパーを配置したくない明確な希望があるサイトです。

重要なポイント:WordPressは、レンダリング性能の自慢よりも、編集機能とプラグインの活用がより重要な場合に引き続き適している。

ヘッドレスWordPressが正しい選択肢である場合

ヘッドレスWordPressはブリッジアーキテクチャです。エディター体験とプラグインエコシステムのためにWordPressを保持しつつ、パフォーマンスとデザインコントロールのためにNext.jsまたはAstroでフロントエンドをレンダリングします。狭いながらも実在する一連のケースで効果があります。

以下の場合に効果があります。編集チームがWordPressにコミットしており移行しない場合だが、マーケティングサイトがパフォーマンスに関わる場合(高トラフィック、高額な広告費、ブランド的に重視するLighthouseスコア)。デザイン言語が異なり過ぎてWordPressテーマレイヤーでは対応できないが、コンテンツモデルが本当にWordPress的である場合(投稿、ページ、カスタム投稿タイプ、ACFフィールド)。会社が編集的成熟度とエンジニアリング的成熟度の両方を備えており、両方の体制構築に余裕がある場合です。

以下の場合には効果がありません。チームが編集的成熟度もエンジニアリング能力も備えていない場合(二重に支払うことになる)、プロジェクトが本当に月に1回編集されるパンフレットサイトである場合、予算が二重スタック保守に対応不可能なほど限定的である場合です。2026年のヘッドレスWordPressを実行する現実的なコストは、12ヶ月間の従来型WordPressの実行コストの約1.5倍から2倍です。パフォーマンスとデザインの利得がそれを正当化することを確認してください。

レンダリング戦略の決定

Next.js レンダリング戦略の相対的なコストと複雑性
SSG はマーケティング向けがデフォルト。ISR と SSR はプロダクトが必要とするときだけコストに見合う。

Next.js の文脈では、レンダリング戦略の選択はフレームワークの選択そのものよりもコスト上の影響が大きい。4つのオプションは以下の通り:

Static Site Generation (SSG)

すべてのページがビルド時に構築され、CDN からプレーン HTML として配信される。最も安価で、最速で、最も安全。マーケティングサイトやブログに適した正当なデフォルト。制約は、コンテンツの変更にはフルリビルドと再デプロイが必要ということ。数千ページ未満のサイトなら問題ない。数万ページのサイトでは、ビルド時間がボトルネックになる。

Incremental Static Regeneration (ISR)

ページはビルド時に静的に生成され、その後オンデマンドまたはスケジュールで再検証される。スケールするコンテンツサイト向けの中間的なソリューション。ほとんどのチームが直面する落とし穴:Vercel での ISR 課金は呼び出し単位であり、9万1000ページで頻繁に再検証する場合、月間数百万イベントのレベルに達したことがある。Deluxe Astrology サイトに「1週間に本番マージは2回まで」という明確なルールがあるのは、各マージがおよそ 600 万件の ISR 書き込みイベントを発火させるからだ。ISR は優れたテクノロジーだが、スケールでは現実的なコスト曲線がある。

Server-Side Rendering (SSR)

すべてのリクエストでページをレンダリング。認証済みダッシュボード、パーソナライズされたコンテンツ、ページコンテンツがリクエストしたユーザーに依存するあらゆるケースに適した答え。コスト モデルはリクエスト単位の CPU であり、トラフィックの多い公開ページではすぐに高額になる。マーケティングページでは SSR を避けよ。

React Server Components (RSC)

Next.js 15 のデフォルトで、上記と組み合わせて使用されることが多い。RSC はデータ取得をサーバーにプッシュし、クライアントに送信する JavaScript を削減する。メンタルモデルは調整が必要だが、パフォーマンスと DX の利点は実在する。2026 年の新しい Next.js の仕事のほとんどはデフォルトで RSC を使用すべき。

CMS レイヤーの決定(ヘッドレスの場合)

Next.js または Astro でヘッドレスに進む場合、CMS レイヤーの決定はフレームワークに次いで 2 番目に重要です。すべてのプロジェクトで評価する 5 つの実行可能なオプション:

Sanity

新しいヘッドレスプロジェクトの私のデフォルト推奨。スキーマアズコードのアプローチは市場で最もクリーンなコンテンツモデルであり、エディタ体験は非技術的なエディタにとって本当に優れており、GROQ クエリ言語はほとんどのコンテンツ形状に対して GraphQL よりも柔軟です。価格は合理的にスケーリングします。トレードオフ:WordPress よりプラグンエコシステムが少なく、カスタム編集ワークフローで時々摩擦が生じます。

ヘッドレス WordPress(WPGraphQL または REST 経由)

エディタの WordPress 親和性が主な制約である場合の正解です。WPGraphQL は 2026 年で成熟しており、Faust.js スタックは Next.js 統合を簡単にします。コスト:WordPress とフロントエンドの両方を保守する必要があります。これは 2 つの世界を橋渡しする固有のオーバーヘッドです。

Supabase

コンテンツモデルが長文散文よりも構造化データである場合の選択肢:ディレクトリ、リスティング、プログラマティック SEO サイト、テーブル形式のもの。HostList.io は Supabase で動作します。コスト:Supabase はコンテンツレイヤーの配慮がある データベースであり、編集上の意味での CMS ではありません。エディタは好みません。

Contentful

強力なワークフロー機能とロケール対応を備えたエンタープライズレベルの選択肢。高い層での価格はすぐにスケーリングします。チームが正式なコンテンツガバナンスと予算に見合う場合に適しています。

Payload、Strapi

データレジデンシーやコスト管理が主な関心事である場合のセルフホスト型オプション。どちらも2025年までに大幅に成熟した。CMS層を自分たちで所有したい技術力を持つチーム向け。

ホスティングと価格の現実

デプロイ先の選択は、時間とともに複合効果をもたらす3番目の決定事項。実行可能なホスト3つ:

Vercel

Next.js公式ホスト、最もスムーズな開発者体験、最高額の価格帯。帯域幅とISR呼び出しはほとんどのチームが請求書が届くまで見落とすコストレバー。DXの優位性のためにVercelでサイトを実際に運用しているが、コスト曲線は予想より急峻。ISRを大規模に使用している場合、最初の見積もりの少なくとも2倍の予算を計上する必要がある。

Netlify

AstroとNext.jsの静的レンダリング向けに優れており、フルRSC対応Next.js App Routerではやや洗練さに欠ける。価格予測はVercelより予測可能。ビルド分単価モデルが注視すべきレバー。本サイトはNetlifyで運用されている。

Cloudflare PagesとWorkers

2026年における最高のコスト対パフォーマンス、規模での運用で他の2つより圧倒的に低コスト、基盤ネットワークはグローバル配信において比類なし。トレードオフ:デプロイメントモデルとNext.js統合はVercelより洗練さに欠ける。コスト重視でエンジニアリング能力があるプロジェクトに対しては、粗い部分をナビゲートする価値がある。

チームフィットの問題

それを保守するチームに合致するフレームワークを選ぶ。当たり前に聞こえるが、Seahawk で見かけるフレームワーク選定の違反ルールの中で最も多いのはこれだ。

React エンジニア 3 人のチームが WordPress で構築すべきではない。PHP エンジニア 1 人と執筆者 3 人のチームが Next.js で構築すべきではない。エンジニアがゼロで フリーランスデザイナー1 人のチームは、Webflow、Framer、ホステッド WordPress のどれでも構築すべきではない。正解は Webflow、Framer、またはホステッド WordPress だ。

フレームワークとチームのミスマッチのコストは初日に支払われない。その後何年にもわたって、チームがフレームワークに対抗して働く状況として支払われる。テクノロジーを運用の現実に合わせるのだ。

パフォーマンス:各プラットフォームが実際に提供するもの

Astro、Next.js、WordPress設定における典型的なLCP範囲
2026年に実装・監査されたサイトからの数値であり、ラボのコスプレではない。

2026 年に私が納品または監査したサイトからの実数値。すべて 75 パーセンタイルのフィールドデータで測定:

静的レンダリングされたAstro

LCP は一貫して 1.0 秒以下。ほとんどのページで初期 JavaScript は 30KB 未満。Lighthouse 100 はデフォルト成果であり、最適化目標ではない。コンテンツサイトにおいて最も難易度の高い層。

Static-rendered Next.js(App Router、RSC)

最適化されたサイトで LCP 1.0 ~ 1.5 秒。初期 JavaScript 80 ~ 150KB。どれだけのクライアントコンポーネントを配信するかによって異なる。Lighthouse 90+ は達成可能だが、意図的な最適化作業が必要。

ISR または SSR Next.js

LCP は 1.5 〜 2.5 秒、キャッシュヒット率とオリジンレスポンスタイムに左右される。コールドキャッシュミスで劇的にパフォーマンスが低下する。適切なユースケースであれば優れたテクノロジーだが、アクティブな監視が必須となる。

マネージドホスティング(Kinsta、WP Engine)上の WordPress に加えて Cloudflare

LCP は通常 1.8 〜 3.0 秒。努力次第で Lighthouse 70 〜 85。ほとんどのコンテンツサイトで許容できるが、静的オプションと比べると実質的に劣る。パフォーマンスの天井は現実的な制約として存在する。

共有ホスティング上の WordPress

LCP は 3.5 秒以上。パフォーマンスがブリーフの一部を占めるサイトでは避けるべき。

3 つのオプション全体の SEO 姿勢

3 つすべてが最高レベルでランク付けできる。2026 年の SEO 議論は、どのフレームワークが「より SEO フレンドリー」かという話ではない。実装品質の問題だ。

AstroまたはNext.jsでの静的レンダリングは、最もクリーンなインデックス可能なHTMLと最速のCore Web Vitalsを提供し、どちらも順位付け要因である。Yoastまたはランク数学を搭載したWordPressはエディタ内SEOツール機能が最も完全であり、これはノンテクニカルエディタがクリーンなメタを出荷するのに実質的に役立つ。Headless WordPressは両方を提供するが、ダブルスタックメンテナンスのコストがかかる。

SEO の失敗を見かけるのは、ブラウザで主要コンテンツをレンダリングする JavaScript 多用型の Next.js サイトの場合だ。Google は技術的には JavaScript でレンダリングされたコンテンツをインデックスできるが、遅延、完全性、一貫性のすべてが HTML でレンダリングされたコンテンツより劣る。SEO が重要であれば、サーバーサイドまたは静的にレンダリングする。常に、だ。

マイグレーション経済学

ほとんどのクライアントは間違ったマイグレーションの質問をします。正しい質問は「WordPressからNext.jsへマイグレーションできるか」ではなく、「各オプションの3年間の総コスト(それを保守するのに必要なチームを含む)はいくらか、そして実際に気になるメトリクスをどちらがもたらすか」です。

Seahawk Mediaで実施する典型的なWordPressからheadless Next.jsへのマイグレーションは、スコープに応じて25,000〜90,000USDです。そのマイグレーションは通常、Lighthouseスコアが広告費用またはコンバージョン率に影響を与えるトラフィックの場合、12か月以内に元が取れます。月間2,000アクセスのブロシュアサイトには元が取れません。

より頻繁に意味があるマイグレーションは、共有ホスティング上のWordPressからKinsta上のWordPress、プラスCloudflareレイヤー、プラスより厳選されたプラグンダイエットです。同じプラットフォーム、異なる運用の現実、再プラットフォーム化のコストの10分の1で、素材的により良いパフォーマンスとセキュリティ。ほとんどのクライアントにとって正しい答えは「Next.jsで再構築する」ではなく、「既存のWordPressのインストールを修正する」です。

私の正直な意思決定ツリー

状況選択理由
エンジニアリングなし、編集のみWebflow / ホスト型WPオペレーション適合性はフレームワークのトレンドに勝る
編集 + 軽量テック、プラグインが重要クラシックWordPressデフォルトのコンテンツオプスの回答
編集 + ブランド/パフォーマンス要件ヘッドレスWP + Astro/Nextエディターを維持し、上限を引き上げる
エンジニアリング主導、コンテンツ量が多い、状態が少ないAstro + Sanity/SupabaseHTMLをデフォルト、必要な箇所のみJS
エンジニアリング主導 + 認証 / プロダクト状態Next.js + Sanity/Supabaseマーケティングとアプリ全体で1つのフレームワーク
大規模なテーブル型データNext/Astro + SupabaseディレクトリとpSEOはデータベースを必要とする

これは2026年のすべての新規クライアント会話で実行する実際の意思決定ツリーです。

チームがエンジニアリング能力をゼロに持っており、編集がこれまたは唯一の機能である場合:WebflowまたはホストされたWordPress。

チームが編集主導で軽い技術サポートがあり、コンテンツが豊富でプラグインエコシステムのニーズがある場合:マネージドホスティング上のクラシックWordPress。デフォルトの答え。

チームが編集主導だが、パフォーマンスとデザインが要件の一部である場合:headless WordPressにAstroまたはNext.jsフロントエンド。

チームがエンジニアリング主導で、プロダクトがコンテンツ豊富で、デザイン言語が珍しく、ユーザー状態がほぼない場合:SanityまたはSupabaseを持つAstro。

チームがエンジニア主導であれば、プロダクトは認証済みユーザー状態とステートフルなインタラクティビティを備えている。Next.js with Sanity または Supabase を使い、Vercel または Cloudflare Pages にデプロイする。コスト感度によって選択する。

データモデルが本当にテーブル型でスケールする場合(ディレクトリ、リスティング、プログラマティック SEO):Next.js または Astro with Supabase を使う。HostList.io がこのケーススタディだ。

重要なポイント:フレームワークの選択は、デモで感情を動かされたことではなく、チーム、コンテンツの形状、3年間の予算に合わせて判断すること。

要点

2026年に「最高」のフレームワークは存在しない。チーム、コンテンツの形状、運用の実態の組み合わせごとに最適なフレームワークが存在するのだ。うまく納品するチームは、この三つを正直に一致させたチームだ。苦労するチームは、フレームワークを先に選んで、自分たちの現実をそれに合わせようとしたチームだ。

間違ったフレームワークを選ぼうとしている三つの正直なサイン。友人が使っているから選んでいる、今四半期のトレンドリストに載っているから選んでいる、マーケティングページのデモが何か感じさせてくれたから選んでいる。これらはどれも良い理由ではない。正しい理由はこうだ。これは自分のチームに合っている、これは自分のコンテンツに合っている、これは三年間の自分の予算に合っている。

自分たちが構築しているものにどれが適切かについて、第二の意見が欲しいなら、Seahawk Media で相談を受け付けている。会話は無料、推奨は正直で、時には現在の WordPress サイトを保ち、ホスティング層を修正することが正しい答えだと言うこともあるだろう。なぜなら、実際の数字がそれを示しているからだ。

ご相談はこちら