TL;DR: ユースケース別のランク付け推奨なので、次の6,000語をスキップできます。

  • コンテンツサイト、マーケティングページ、ブログ、プログラマティックSEO: Astro 5。静的HTMLを配信し、JavaScriptが必要な部分だけをハイドレーション、Lighthouseスコアは95-100。ホスティング費用は圧倒的に安い。
  • SaaSアプリ、ダッシュボード、認証付き製品: Next.js 16 with App Router。採用プール最大、エコシステムが最深、Server Componentsはようやく安定。
  • 最小バンドル、最高パフォーマンス天井: SvelteKit with Svelte 5 runes。チームはReactメインストリームの外での作業に慣れている必要があります。
  • Vueショップ、特にEU/アジアのチーム: Nuxt 3。Vueのメタフレームワークはこれです。
  • URL中心の製品（マーケットプレイス、複数ステップフォーム）: Remix (now React Router 7)。Webスタンダードフォーム、デフォルトで段階的エンハンスメント。
  • Gatsby: 移行してください。真面目に。

2026年における「モダンフレームワーク」の実際の意味

CTOやマーケティングリーダーが2026年に「フレームワーク」と言うとき、通常は3層か4層を1つの言葉に混同しています。契約を結ぶか、チームを雇うかするときにこの区別は重要なので、分解してみます。

レンダラーはUIライブラリです：React 19、Vue 3、Svelte 5、Preact。コンポーネントをDOMノードに変換する方法を決定します。

メタフレームワークは上位レイヤーです：Next.js、Astro、SvelteKit、Nuxt、Remix。ルーティング、データ読み込み、サーバーレンダリング、静的生成、ビルドパイプラインを処理します。このレイヤーはアーキテクチャの決定の90%が存在するレイヤーです。

バンドラーはコードをコンパイル、縮小、チャンクするツールです。2026年では、Turbopack (Next.js)、Vite (Astro、SvelteKit、Nuxt、Remix)、またはWebpack（レガシープロジェクト）です。

デプロイターゲットは出力が実行される場所です：Vercel、Netlify、Cloudflare Pages、AWS Amplify、プレーンVPS、またはDockerコンテナ。メタフレームワークはどのデプロイターゲットがファーストクラスの市民であるかを決定します。

これが重要な理由は：2026年の「フレームワーク」を選択することは、2015年のWordPress vs Squarespaceを選択することのようではないということです。これはアーキテクチャの決定で、ホスティング戦略、採用プロフィール、パフォーマンス天井、次の3～5年間の移行コストをロックインします。2時間の会議で選んだフレームワークからの移行に$150Kを費やす企業を見てきました。このポストはそのような状況に陥らないようにするために存在します。

2024年から2026年への変化も注目する価値があります。Server ComponentsはReact 19で安定として出荷されました。AstroはServer Islandsを導入しました。Svelte 5のrunesは古いリアクティブストアに取って代わりました。これらは増分アップグレードではありません。コードがどこで実行され、何がブラウザーに配信されるかについての考え方を変えます。メンタルモデルがまだ「APIを備えたSPA」であれば、2020年のプレイブックで作業しています。

重要な6つのフレームワーク（および重要ではない4つ）

サバイバルリスト：

  1. Next.js 16 -- Reactのデフォルト。App Routerは安定、Server Componentsは実装、Turbopackは本番バンドラー。
  2. Astro 5 -- コンテンツサイトをきちんと作成。マルチフレームワークアイランド、Server Islands、Sessions API、デフォルトではゼロJS。
  3. SvelteKit -- Svelte 5のrunesはリアクティビティを明示的にします。グループの中で最も小さいバンドル。本番アプリに過小評価されています。
  4. Nuxt 3 -- Vue 3のメタフレームワーク。ヨーロッパ、アジア、Vueエコシステムに既に取り組んでいるチームで強力。
  5. Remix (React Router 7) -- Webの基本が最初。フォーム、ローダー、アクション、段階的エンハンスメント。最近React Routerにマージされました。
  6. Gatsby -- レガシー。数千のエンタープライズサイトでまだ実行されています。しかしNetlifyはチームを削減し、プラグインエコシステムは腐り始め、2024年半ばから重大な更新がありません。

賭けるべきではない人：

  • Create React App (CRA): 正式に廃止。React docsはもはやそれを推奨していません。まだCRA上にいる場合は、Next.jsまたはViteに移行してください。
  • Blitz.js: 「Reactに対するRuby on Rails」のピッチは機能しませんでした。コアチームは先に進みました。コミュニティはゴーストタウンです。
  • RedwoodJS: 興味深いアイデア、放棄されたモメンタム。1.0ハイプは本番採用の規模に変わりませんでした。
  • プレーンVite SPA for content sites: Viteは優れたビルドツールですが、2026年にマーケティングサイト用にクライアントレンダリングされたSPAを配信することは、Googleのクローラーと戦い、Lighthouseポイントを燃やし、あなたの訪問者に相応しくない水分化税を支払うことを意味します。

フレームワークごとの詳細ダイブ

Next.js 16

それは何か。 Next.jsはVercelによって維持されているReactメタフレームワークです。これはこのリストで最も広く採用されているフレームワークで、npmダウンロード、求人投稿、GitHubアクティビティでは3～4倍の係数です。2026年にReactで構築していて、別の何かを選ぶ強い理由がない場合、おそらくNext.jsを選んでいます。

2026年に配信されるもの。 Next.js 16は、13で導入され、14と15を通じて改善されたApp Routerを安定させます。Server Componentsはデフォルトです。Server Actions (React docsではServer Functionsと呼ばれています) を使用すると、APIルートを構築せずにサーバーで実行される変異を作成できます。Turbopackは本番バンドラーとしてWebpackに取って代わり、大きなコードベースでビルド時間を40～60%削減します。Partial Prerendering (PPR) を使用すると、静的シェルをストリーミング動的穴で提供でき、これは増分静的再生成以来、認証されたアプリにとって最大のパフォーマンス改善です。

実際のLighthouseスコア。 当社のポートフォリオの40以上のNext.js本番サイト全体で、モバイルLighthouseパフォーマンススコアは82～96です。中央値は89です。低端はサードパーティスクリプト（分析、チャットウィジェット、A/Bテスト）が多いサイトから来ています。クリーンなNext.js 16マーケティングページはスクリプト最小限で最適化された画像を備えたスコア92～96を一貫して提供します。

ホスティングコストの軌跡。 Vercelのプロプランは月額$20/シートで、帯域幅と関数呼び出しで実際のコストに達します。月100K訪問者で、$40-120/月を予想してください。1M月訪問者で、$180-600/月。ダイナミクス対静的比率によって異なります。10Mで、$1,200-4,500/月。Cloudflare Pages with OpenNextアダプターはバジェットプレイです：1M訪問者で$0-50/月ですが、いくつかのVercel特定機能を失います。AWS Amplifyはその間のどこかに落ちます。Next.jsで構築することについてさらに深く掘り下げたい場合は、Next.js開発機能を参照してください。

ビルド複雑性。 シニアReact開発者は2～4週間で本番Next.js 16サイトを配信できます。ReactExperienceを持つジュニア開発者は4～8週間必要で、Server Component / Client Componentの境界でつまずくでしょう。App RouterのメンタルモデルはPages Routerから本当に異なっており、2023年のチュートリアルはあなたを積極的に誤解させます。

採用市場。 Reactは米国市場で最も一般的なフロントエンドスキルです。シニアNext.js開発者は$150K-220K/年（米国、フルタイム）または$100-180/時間（契約）を命じます。才能プールは深いですが、「Reactを知っている」はApp Routerを知っていることを意味しません。Server Components経験を具体的にベットしてください。

選ぶべき時。 SaaSプロダクト、認証されたダッシュボード、動的パーソナライゼーション付きeコマース、チームがすでにReactである任意のプロジェクト。また、すべての意思決定者がそれを聞いたことがあるため、エンタープライズバイインのための最も安全な賭けです。

選ぶべきではないとき。 クライアント対話を必要としない純粋なコンテンツサイト。React Runtimeの80-150KBを静的HTMLだった可能性を表現するために配信します。Astroが勝つところです。

WordPressからの移行複雑性: 3/5。中程度。データレイヤーが難しい部分です。ヘッドレスCMS（Sanity、Contentful、Payload）と、リダイレクト戦略が必要です。ビルドは直前ですが、コンテンツモデリングは時間がかかります。WordPress to Next.js migrationで詳細にカバーしています。

Astro 5

それは何か。 Astroはコンテンツ優先のフレームワークで、デフォルトではゼロJavaScriptを配信します。Astroの独自のテンプレート構文でコンポーネントを作成するか、独自のものを持参（React、Vue、Svelte、Preact、Solid）し、Astroはそれらをビルド時に静的HTMLにレンダリングします。対話的なコンポーネントは、client:load、client:visible、またはclient:idleディレクティブで明示的にオプトインした場合にのみクライアントでハイドレーションされます。この「アイランドアーキテクチャ」は、対話的なウィジェットがない限り、ブログ記事ページが0KBのJSを配信することを意味します。

2026年に配信されるもの。 Astro 5はServer Islands（ページの残りが静的またはキャッシュされている間に特定のコンポーネントをリクエスト時にサーバーで表示）、Sessions API（外部ステートストアなしのファーストパーティセッション管理）、Content Layerの改善（型安全なMarkdown/MDX）、および改良されたView Transitions APIを導入します。Starlightドキュメンテーションフレームワークは成熟し、広く採用されています。

実際のLighthouseスコア。 これはAstroが誰もが恥をかかせるところです。当社のポートフォリオの25以上の本番コンテンツサイト全体で、モバイルLighthouseパフォーマンススコアは95～100です。中央値は98です。ゼロJSを配信するとき、それを悪くスコアするのは難しいです。LCP 1.2s未満は例外ではなく、ノルムです。

ホスティングコストの軌跡。 Cloudflare Pages上の静的なAstroサイトは1M月訪問者で$0です。無料層。Netlifyの無料層はほとんどのコンテンツサイトを処理します。Vercel静的ホスティングも規模でも実質的に無料です。Server IslandsまたはSSRモードを使用している場合、コストは少し上がります：Cloudflareの1M訪問者で$5-30/月、Vercelで$30-80/月。これはホスティングするための最も安いフレームワークです。

ビルド複雑性。 基本的なHTML/CSS/JSスキルを持つジュニア開発者は1～2週間で本番Astroサイトを配信できます。真面目に。学習曲線はこのリストで最も穏やかです。対話性が必要な場合は、チームが知っているUIライブラリを持参するため、天井はチームのスキルの高さと同じです。

採用市場。 Astro固有の経験はReactより稀ですが、それは必要ありません。すべてのフロントエンド開発者はAstroのテンプレート構文を1日で学ぶことができます。アイランドモデルは、選択のコンポーネントライブラリ（React、Vue、Svelte）を雇用し、Astroレイヤーを教えることを意味します。米国シニア開発者レート：$130K-190K/年または$90-150/時間。

選ぶべき時。 マーケティングサイト、ブログ、ドキュメント、コンテンツ豊富なパブリッシャー、プログラマティックSEO規模（50,000以上のページを備えたAstroサイトを構築しました。3分以内でビルドします）、パフォーマンスが売上ポイントであるエージェンシーサイト。

選ぶべきではないとき。 高度な対話的なSaaS アプリ、リアルタイムダッシュボード、ほとんどのページが認証と動的データを必要とするもの。Astroはアプリのような対話性のためにそれを設計しなかった、あなたはそれと戦うでしょう。コンテンツプロジェクトについては、Astro開発機能をチェックしてください。

WordPressからの移行複雑性: 2/5。コンテンツサイトの最も簡単な移行ターゲット。WordPress コンテンツをMarkdownにエクスポートするか、ヘッドレスCMSに接続し、テンプレートをAstroレイアウトにマップし、リダイレクトを設定します。50ページのマーケティングサイト移行は2～4週間で移行します。

SvelteKit

それは何か。 SvelteKitはSvelteの公式メタフレームワークです。Svelteはビルド時にコンポーネントをバニラJavaScriptにコンパイルします。これは仮想DOMのディフを実行時にする必要がないことを意味し、バンドルサイズが大幅に削減されます。Svelte 5は「runes」を導入しました。これは古い$:リアクティブステートメントを明示的な$state()、$derived()、$effect()プリミティブに置き換えます。これは論争の的でしたが、実際には、大きなコードベースがより予測可能で、デバッグしやすくなります。

2026年に配信されるもの。 Svelte 5のrunesは安定しています。SvelteKitのアダプターシステムはVercel、Netlify、Cloudflare、Node、および静的出力をサポートしています。サーバー側レンダリングはファーストクラスの市民です。フォームアクションはクライアント側の状態管理なしに変異を処理します。新しい$effect.tracking()と細粒度リアクティビティシステムは、React系フレームワークより意図しない再レンダリング数が少ないことを意味します。

実際のLighthouseスコア。 当社のSvelteKit本番サイトからのモバイルLighthouseスコアは90～98で、中央値は94です。バンドルは一般的にNext.js版より30-60%小さいです。React Runtimeがないため。いくつかの対話的なコンポーネントを備えたSvelteKitアプリは、Next.js同等が85-120KBを配信する場合、通常、合計25-40KBのJSを配信します。

ホスティングコストの軌跡。 SSRモードではNext.jsに似ています。Vercel：$40-120/月で100K訪問者、1M で$180-500/月。Cloudflare Pages：1Mで$0-40/月。バンドルサイズが小さいため、帯域幅メータリングされたホストでは、Next.jsと比較して帯域幅コスト10-20%を節約し、より小さい帯域幅コストになります。

ビルド複雑性。 チームがSvelteを知っている場合は2～4週間です。チームがReactからSvelteを学んでいる場合は、メンタルモデルシフトに2～3週間を追加してください。Svelte 5のrunesは実は古いSvelteより反応的な移行を容易にするため、$state()はuseState()に概念的に閉じています。

採用市場。 これはSvelteKitの最大の弱点です。Svelteの才能プールはReactプールのサイズの約10～15%です。米国シニア料金：$140K-200K/年または$100-160/時間。しばしばSvelteを学びたいReact開発者を採用します。これが機能しますが、ラムアップ時間を計画してください。

選ぶべき時。 パフォーマンス重要なアプリ。バンドルサイズの重要性（モバイルファーストプロダクト、遅い接続による新興市場）、すでにSvelteエコシステムにいるチーム、開発者トレーニングに投資できるプロジェクト。

選ぶべきではないとき。 迅速にバックフィル開発者を必要とするエンタープライズプロジェクト。React経験が採用フィルターである大規模なチーム。Reactー特定のライブラリ（ヘッドレスUI、Radix等）に大きく依存するプロジェクト。

WordPressからの移行複雑性: 3/5。Next.jsに似ていますが、オフザシェルフCMS統合が少ないです。ほぼ確実にREST または GraphQL APIを持つヘッドレスCMS とペアリングします。

Nuxt 3

それは何か。 Nuxt 3はVue 3に対するNext.jsのようなものです。ファイルベースのルーティング、サーバー側レンダリング、静的生成、豊富なモジュールエコシステムを持つ完全な機能を備えたメタフレームワークです。チームがVueを書く場合、Nuxtはメタフレームワークです。Vueエコシステムに本当の代替案はありません。

2026年に配信されるもの。 Nuxt 3はNitro（任意の場所にデプロイするサーバーエンジン）で実行され、ビルドにViteを使用します。Composition APIはスタンダードです。Nuxt DevTools は優れています。サーバールートと API ルートが組み込まれています。モジュールエコシステム（Nuxt Content、Nuxt Image、Nuxt SEO）はサードパーティパッケージなしでほとんどの一般的なニーズをカバーしています。

実際のLighthouseスコア。 本番から：85-95、中央値90。Next.jsに匹敵する。VueランタイムはReactより若干小さいため、バンドルサイズはベースラインで10-15%低くなります。

ホスティングコストの軌跡。 Next.js とほぼ同一。Vercelはネイティブに Nuxt をサポートしています。NetlifyとCloudflare Pagesはうまく機能します。ダイナミク対静的比に応じて1M月訪問者で$150-500/月。

ビルド複雑性。 Vue開発者は2～4週間で配信します。Vueを学ぶReact開発者は3～5週間が必要です。Composition APIは古いOptions APIより反応的なフックに近いため、移行は管理可能です。

採用市場。 Vueはヨーロッパ（フランス、オランダ、ドイツ、特に）とアジア全体で強力です。米国では、Vueの才能プールはReactの約25-30%のサイズです。米国シニア料金：$130K-190K/年。チームまたは市場がすでにVueに向いている場合、Nuxtは明らかな選択です。米国からゼロからチームをスタッフアップしている場合、React/Next.jsの採用プールは大幅に深いです。

選ぶべき時。 チームはすでにVueを書いています。Vueタレントが豊富な地域にいます。VueのテンプレートシンタックスとComposition APIをJSXより好みます。

選ぶべきではないとき。 ゼロからの米国ベースのチームのスタッフアップ。絶対に最大のエコシステム（Reactがボリュームで勝つ）のサードパーティコンポーネントと統合。

WordPressからの移行複雑性: 3/5。Next.js と同じです。ヘッドレスCMS + Nuxtフロントエンド + リダイレクトマッピング。

Remix (React Router 7)

それは何か。 Remix は2024年後半にReact Routerにマージされました。「フレームワークモード」を備えたReact Router 7は、かつてRemixと呼ばれていたものです。哲学はWebの基本です：HTMLフォーム、HTTPキャッシング、段階的エンハンスメント、サーバーで実行されるローダー/アクション。それは、それを再発明する代わりに、プラットフォームを使用することについて意見を持っています。

2026年に配信されるもの。 React Router 7 は React 19 サポート、Server Components (部分的、オプト-イン)、RSC ベースのデータ読み込み、Vite をバンドラーとして、Cloudflare Workers への最初のクラスサポートを備えています。ローダー/アクションパターンはコアメンタルモデルのままです。フレームワークはNext.jsよりスリムで、HTTPレイヤーに対する制御が増えています。

実際のLighthouseスコア。 モバイルLighthouse：88-96、中央値92。Remixの段階的エンハンスメントアプローチは、Lighthouseの数字はNext.jsと同様のときでも、JSなしでページが機能することを意味します。これは認識されるパフォーマンスを支援します。

ホスティングコストの軌跡。 Remixはランデブーに正常に実行します（1M訪問者で$5-25/月）、Fly.io（$10-60/月）、またはNodeJS.jsホスト。Vercelはそれをサポートしていますが、Next.jsのようなネイティブプラットフォームではありません。Remixはvercel固有のインフラに依存しないため、予算ホストが実行可能です。

ビルド複雑性。 REST パターンに精通した React 開発者は 2 ~ 4 週間で出荷します。ローダー/アクションモデルは、サーバーレンダリングされたアプリで以前に作業した場合、直感的です。SPAのみの背景からの開発者は、調整に1～2週間の余分が必要な場合があります。

採用市場。 Remix固有の才能は隆起ですが、フードの下でReactなので、シニアReact開発者は迅速にランプアップできます。React Routerとのマージは実際に役立ちました。React Routerはほぼ普遍的だからです。

選ぶべき時。 マーケットプレイス、複数ステップフォーム豊富なアプリ、URLの構造が深く重要なプロダクト、Webスタンダードに近く滞在したいチーム、Cloudflare Workersにデプロイするプロジェクト。

選ぶべきではないとき。 コンテンツ豊富なサイト（Astroが良い）。チームがNext.jsエコシステムの例、チュートリアル、Stack Overflow回答を期待するプロジェクト。「Next.jsを使用します」が安全な政治的回答のエンタープライズ環境。

WordPressからの移行複雑性: 3/5。Next.js と同じです。データレイヤーは同じ課題です。

Gatsby

2026年で何か。 Gatbsy は React と GraphQL 上に構築された静的サイトジェネレータです。2019-2021年のお気に入いでした。Netlifyはそれを獲得し、効果的に放棄しました。最後の大きな分泌は2024年半ばでした。プラグインエコシステムは腐食しています。コアメンテナーは先に進みました。大規模なサイト（10K以上のページ）のビルド時間は、Astroと比較してもいまだに不快に遅いか、ISRでNext.js。

実際のLighthouseスコア。 モバイルLighthouse：75-90、中央値82。Gatsbyteis は多くのJSをデフォルトで配信しており、GraphQLデータレイヤーは新しいフレームワークが完全に回避するオーバーヘッドを追加しています。

ホスティングコストの軌跡。 Gatsby Cloud はシャットダウンしました。Netlify、Vercel、S3 + CloudFront でホストしています。コストはNext.js staticと同様：1M 訪問者で $50-200/月。

選ぶべき時。 選ぶべきではありません。Gatsby に触れる唯一の理由は、2026 年の Gatsby サイトを継承し、移行を計画しながら維持する必要がある場合です。

選ぶべきではないとき。 どんな新しいプロジェクト。期間。

WordPressからの移行複雑性: N/A。Gatsby から遠ざかります。Gatsby上にあり、次のステップを検討している場合は、パスは通常Gatsby from Astro（コンテンツサイト）またはGatsby to Next.js（アプリのようなサイト）です。

比較表

パフォーマンス＆開発者体験マトリックス

フレームワーク 平均Lighthouseモバイル 平均LCP (s) 平均INP (ms) バンドルサイズ (KB) コールドスタート (ms) ビルド時間 (1Kページ)
Next.js 16 89 1.8 120 85-140 150-400 45-90s
Astro 5 98 0.9 40 0-30 50-120 20-40s
SvelteKit 94 1.3 75 25-55 100-250 30-60s
Nuxt 3 90 1.6 110 70-120 140-350 50-100s
Remix (RR7) 92 1.4 90 70-110 80-200 35-70s
Gatsby 82 2.4 180 120-200 N/A (static) 180-600s

1M月訪問者時のホスティングコスト (USD/月)

フレームワーク Vercel Netlify Cloudflare Pages AWS Amplify
Next.js 16 (SSR) $180-600 $200-500 $20-80* $150-400
Astro 5 (Static) $0-20 $0-19 $0 $0-15
Astro 5 (SSR) $30-80 $40-100 $5-30 $30-80
SvelteKit (SSR) $180-500 $180-450 $15-60 $120-350
Nuxt 3 (SSR) $150-500 $180-450 $15-60 $120-350
Remix (SSR) $150-400 $150-400 $5-25 $100-300
Gatsby (Static) $50-200 $50-200 $0-10 $40-150

*OpenNextアダプターを備えたCloudflare Pages;いくつかのVercel固有の機能は利用不可です。

ユースケースフィット

ユースケース Next.js 16 Astro 5 SvelteKit Nuxt 3 Remix Gatsby
マーケティングサイト 良好 最高 良好 良好 良好 回避
ブログ / コンテンツハブ 良好 最高 良好 良好 良好 回避
電子商取引 最高 回避 良好 良好 良好 回避
SaaS アプリケーション 最高 回避 良好 良好 良好 回避
マルチテナントプラットフォーム 最高 回避 良好 良好 最高 回避
プログラマティックSEO (50K以上のページ) 良好 最高 良好 良好 良好 回避

決定木

60秒でこれを実行します。上から下へ移動し、最初の一致を取得します。

  1. チームがReact エンジニアであり、SaaSアプリまたは認証されたプロダクトを構築している場合 → App Routerを使用したNext.js 16。
  2. コンテンツサイト、マーケティングサイト、ブログ、またはドキュメントを構築している場合 → Astro 5。競争なし、パフォーマンスとホスティングコストについて。
  3. 最も小さいバンドルを希望し、チームがSvelte 5のrunesを学ぶのに満足している場合 → SvelteKit。
  4. チームはすでにVueを書く場合、またはVueストロングの市場で雇用している場合 → Nuxt 3。
  5. マーケットプレイス、フォーム豊富なプロダクト、またはCloudflare Workersにデプロイしている場合 → Remix / React Router 7。
  6. 現在Gatsbytronに存在する場合 → 投資を停止してください。Astro（コンテンツ）またはNext.js（アプリ）への移行を計画してください。
  7. 100K月訪問者を超えるWordPressにいて、パフォーマンス/セキュリティが懸念される場合 → Next.js + ヘッドレスCMSまたはAstro + ヘッドレスCMSに移行してください。
  8. このを読んでいるnon技術的なマーケティングリーダーの場合 → ヘッドレスアーキテクチャを専門とするチームを雇用してください。フレームワークの選択は、チームの経験による経験より少なく重要です。ヘッドレスCMS開発ページを開始してコンテキストを取得します。

実生産スタック推奨事項

2014年以来、エージェンシー、スタートアップ、エンタープライズクライアント全体で5,000以上のサイトを配信しています。これら3つのスタックは2026年のすべての製品で、生産展開からの実際のコスト範囲で。

スタック A：コンテンツサイト / マーケティング

Astro 5 + Sanity + Vercel (またはCloudflare Pages) + メール転送するのためのResend

これは、マーケティングサイト、エージェンシービルド、コンテンツパブリッシャーの既定値です。Sanity は編集者にリアルタイム協調編集経験を与えます。Astroはすべてを静的HTMLにレンダリングします。VercelまたはCloudflareはエッジで提供します。

  • 1M MV の月額費用： $30-180/月（Sanityフリーティアはほとんどのマーケティングサイトをカバー; Vercel staticはほぼ無料; Resendは取引メールで$20/月）
  • ビルド時間: 30ページマーケティングサイトの場合、2～4週間
  • チームサイズ: 1人の上級開発者 + 1人のデザイナー
  • パフォーマンス: 毎回のページで Lighthouse 96-100

このスタックは、WordPressをオフにするチームに最も推奨するものです。Sanityの編集経験はwp-adminの構造化コンテンツより本当に良く、フロントエンドパフォーマンスは別のリーグに。それがあなたのような状況に聞こえると、Astro開発について話してください。

スタック B：SaaSアプリケーション

Next.js 16 App Router + Supabase + Stripe + Vercel + PostHog

これは、2026年バージョンの「インディSaaS」スタックで、$10M+ ARRに拡張します。Supabaseは認証、データベース（Postgres）、およびリアルタイム購読を処理します。Stripeは支払いを処理します。PostHogは分析とfeature フラグを処理します。Vercelはサイトをホストします。

  • 100K MRR の月額費用： 合計$280-1,800/月（Vercel $200-800、Supabase $25-300、Stripe 2.9% + $0.30/txn、PostHog $0-450）
  • ビルド時間: MVP の場合、6～12週間
  • チームサイズ: 2～3人の開発者
  • パフォーマンス: ダッシュボード複雑さに応じて Lighthouse 85-94

鍵の洞察：最初から過度に建築しないでください。Supabaseの行レベルセキュリティとPostgresは3つの個別サービスの作業を行います。$5M ARR を過ぎている場合、専用インフラに移行します。このスタックで数十のSaaSプロダクトを構築してきました。SaaS開発作業で文書化されています。

スタック C：マルチロケールエンタープライズ

Next.js 16 + Sanity + Cloudflare Pages + Algolia

30以上のロケール、数万のページ、検索機能を備えたエンタープライズマーケティングサイトは別のアプローチが必要です。ここではVercelより Cloudflare Pages、グローバルエッジネットワークがマルチリージョン遅延を規模で処理する方法は優れており、コスト差は重大です：Vercelで$2,000-5,000/月の5M月訪問者 vs Cloudflareで$500-2,000/月。

  • 5M MV 30 ロケール全体の月額費用： $450-5,000/月（Cloudflare $50-400、Sanity $99-799、Algolia $100-1,500、監視/CDN/misc $200-2,300）
  • ビルド時間: 12～24週間
  • チームサイズ: 3～5人の開発者 + 1人のプロジェクトマネージャー
  • パフォーマンス: Lighthouse 88-95

Algolia は言語固有のランキング付けを備えたすべてのロケール全体で検索を処理します。Sanityのローカライゼーション機能は、ロケール固有フィールドを備えた単一のドキュメント内でコンテンツを処理します。Next.js i18n ルーティングはロケール スラッグを正しいコンテンツにマップします。

移行の現実

WordPressからDrupal やSitecore を2026年にシフトしている場合、これは90%のエージェンシーが契約に署名する前に告げていないものです。

タイムラインの現実：

  • マーケティングサイト（最大100ページ）：6～12週間、開始からライブ
  • コンテンツ豊富なサイト（500～5,000ページ）：10～16週間
  • 電子商取引：12～24週間
  • 統合（CRM、ERP、DAM）を備えたエンタープライズ：16～32週間

カットオーバーで壊す5つのもの：

  1. リダイレクト。 WordPressのURLパターン（/category/post-name/、/page/2/）はフレームワークのデフォルトと一致しません。リダイレクトを逃すと、有機トラフィックは夜間で20-40%低下します。すべての単一URLをマップしてください。クロール工具（Screaming Frog、Sitebulb）を使用して、コードの行を作成する前にリダイレクトリストを作成してください。

  2. 構造化データ / スキーママークアップ。 WordPressプラグイン（Yoast、RankMath）はJSON-LD を自動的に生成しました。新しいサイトは、明示的に構築しない限り、何も配信しません。記事スキーマ、FAQスキーマ、パンくずスキーマ、組織スキーマ：すべての手動実装が必要です。

  3. Hreflang タグ。 マルチロケールコンテンツがある場合、hreflangigtは初日に正しくする必要があります。Googleは再クロール数週間かかり、不正なhreflangi原因は間違ったロケールで順位付けします。カットオーバーの前ではなく、hreflangigtタグ検査官でテストしてください。

  4. インデックス時間を検索します。 Googleは、完璧なリダイレクトでも、主要なURL構造の変更後に、サイトの完全な再インデックスに2～8週間かかる可能性があります。一時的な有機トラフィック低下5-15%を計画してください。それは回復しますが、CMOはそれがくることを知る必要があります。

  5. イメージURL。 WordPressはイメージを/wp-content/uploads/YYYY/MM/に保存します。新しいサイトはCDNを使用して異なるパス。外部サイトまたはメールが古いイメージURLにリンクする場合、これらは404 sでない限り、それらはリダイレクト。また、イメージはしばしばサイトのインデックス化URLの40-60%です。

実際のコスト帯： ページ数、統合、コンテンツの複雑さに応じて$25K-200K。30ページマーケティングサイト移行は$25K-50Kで実行されます。カスタムポストタイプ、WooCommerce、3つの言語ロケール付き2,000ページコンテンツサイトは$80K-200Kで実行されます。

フェーズ対カットオーバーの場合： 500以上のページまたは複雑な統合がある場合フェーズします。新しいフレームワークをサブドメインまたはサブディレクトリで最初に実行します。セクションの移行を段階的に進みます。200以下のページと本番環境で1つのスプリントですべてを検証できる場合にカットオーバーします。

詳細な移行プレイブックについては、以下を参照してください：

よくある質問

2026年で最もモダンなWebフレームワークは何か？

Astro 5とNext.js 16は2026年では技術の最先端を表していますが、異なる目的を提供しています。Astro 5はコンテンツ駆動型サイトの最もモダンな選択です。デフォルトではゼロJavaScriptを配信し、Lighthouseスコアを一貫して95-100で達成しています。Next.js 16は対話的なアプリケーション用の最もモダンな選択です。安定したServer Components、Server Functions、および Partial Prerendering。2026年の「モダン」は、シングルページアプリケーションではなく、選択的クライアントハイドレーションを備えたサーバーファーストレンダリングを意味します。ブログ記事をレンダリングするためにフルJavaScriptランタイムを配信するための古いモデルはもはやモダンプラクティスと見なされません。

Next.js はまだ2026年で最高のフレームワークですか？

Next.js 16はまだ2026年で最高の汎用Reactフレームワークですが、すべてのプロジェクトに対して最高のフレームワークではありません。それは確かSaaSアプリ、e-コマースプラットフォーム、認証されたプロダクトのための最良の選択です。深いエコシステムと大きな才能プール、Vercelのインフラストラクチャのため。ただし、コンテンツサイトについては、Astro 5はスピード、コスト、シンプリシティでNext.jsを上回ります。バンドルサイズが重要なプロジェクトについては、SvelteKitは大幅にJavaScriptが少なく配信されます。Next.jsは確実な場合は、確実なデフォルトです。しかし、「確実」と「最善」は同じことではありません。

マーケティングサイトについてはAstroまたはNext.js を使用する必要がありますか？

マーケティングサイトについてはAstro 5を使用してください。AstroはデフォルトではゼロJavaScriptを配信し、Lighthouseモバイルスコア95-100対同様のコンテンツのNext.jsの典型的な89-96にもたらします。ホスティングコストは劇的に低いです：Cloudflare Pages上の静的Astroサイトは1M月訪問者で$0/月、Vercel上のNext.jsサイトは$180-600/月です。ビルド複雑さもより低い；ジュニア開発者は1～2週間でAstro マーケティングサイトを配信できます。Next.jsをマーケティングサイトのために選択するための唯一の理由は、同じコードベースが認証されたアプリセクションも提供する必要があり、その時でも、2つの個別デプロイメントを実行する方が良いかもしません。

SvelteKitは2026年で本番に対応していますか？

はい、SvelteKitは2026年で完全に本番に対応しています。Svelte 5のrunesは安定、アダプターエコシステムはすべての主要なホスティングプラットフォームをカバー、そしてApple、Spotify（内部ツール）、New York Times Wirecutterなどの企業は本番で Svelte を使用しています。SvelteKitは任意のメジャーフレームワークのうち、最小バンドルを配信し、通常、同等のNext.jsアプリケーションより30-60%少ないJavaScript。主要なリスクは技術的な準備ではなく採用です：Svelte才能プールはReactの約10～15%のサイズです。チームをスタッフアップできる場合、SvelteKitは優れた選択です。

2026年のSEOのための最高のReactフレームワークは何か？

Next.js 16は2026年のSEO用の最高のReactフレームワークです。それは静的生成、サーバー側レンダリング、および増分静的再生成をサポートし、すべては検索エンジンが即座にインデックス化できる完全なレンダリングHTMLを生成します。Metadata APIはタイトルタグ、メタ説明、Open Graph タグ、JSON-LD構造化データに対する細かい制御を提供します。Partial Prerendering は静的コンテンツを即座にサーバー。ダイナミックセクションをストリーミングしますCore Web Vitals。Remix (React Router 7) はサーバーレンダリングアプローチでもSEOに強いですが、Next.jsはより多くの組み込みSEOツーリングと大きなSEO重点の例のエコシステムを備えています。

1M月訪問者でNext.jsサイトをホストするコストはいくらですか？

次のプラットフォームとレンダリング戦略に応じて、1M月訪問者でNext.jsサイトをホストするコストは月額$20～600です。Vercel Pro上で、静的ページとサーバーレンダリングされたページの混合で$180-600/月を期待してください。OpenNextアダプターを備えたCloudflare Pages上で、コストは$20-80/月に低下しますが、一部のVercel固有機能は代替ソリューションを必要とします。AWS Amplify上で、$150-400/月が典型的です。Pure静的Next.jsエクスポート（SSRなし）を実行している場合、任意のプラットフォーム上のコスト$0-50/月に低下します。最大のコスト変数はサーバーレンダリングされた対静的ページの比率であり、イメージ帯域幅が続きます。

Gatbsy は死んでいますか？

Gatbsy は技術的には死んでいませんが、2026年現在は効果的に放棄されています。Netlifyは2023年でGatsbyを獲得、Gatsby Cloudをシャットダウンし、コアチームを最小のメンテナンスに削減しました。最後の大きなフィーチャーリリースは2024年半ばでした。プラグインエコシステムは衰退しており、多くの人気のあるプラグインはメンテナンスされていませんし、現在のNode.jsバージョンとの互換性がありません。大規模なサイトのビルド時間は、Astroまたはそれ以上の3～10倍遅いままですNext.js。Gatbsy を今日使用している場合、移行を計画してください。コンテンツサイトについては、Astro 5は自然な後継者です。アプリのようなサイトについては、Next.js 16。Gatbsy上の新しいプロジェクトを開始しないでください。

WordPress からAstro に移行できますか？

はい、WordPressからAstroへの移行は2026年で利用可能な最も簡潔な移行パスの1つです。コンテンツに焦点を当てたサイトについては、WordPressコンテンツをMarkdownファイルにエクスポートするか、AstroをSanity、Contentful、またはPayloadなどのヘッドレスCMSに接続します。Astroの Content Collections は型安全コンテンツ処理を提供します。典型的な50ページマーケティングサイトは2～4週間で移行します。主な課題は他のWordPress移行と同じです：リダイレクトマッピング、構造化データの再実装、イメージURL処理。結果は95-100でLighthouseにスコアするサイト、ホストするコストはほぼゼロ、WordPressよりはるかにセキュア。なぜなら攻撃するサーバー側ランタイムはないから。我々はこの移行を難しさ2/5で評価します。WordPress 代替での完全なガイドを参照してください。