3年前、クライアントのNext.jsストアフロントを「予算削減型クラウド」プロバイダーに乗せました。名前は出しませんが、彼らはすでに1年分を前払いしていたので、言い争いたくなかったからです。初回のフラッシュセールで、サイトは14分で落ちました。14分です。クライアントは彼らの見積もりでおよそ£28,000の注文を失いました。その後、同じ間違いは二度と犯していません。その午後の経験が、2026年にフロントエンドをどこでホストするかと人々に聞かれた時、私がかなり率直である理由です。
当然のことながら、単一の正解はありません。しかし間違った答えはたくさんあり、このポストはそれらについてのものが大部分です。
私はGautamです。ロンドンからSea hawk Mediaを運営しています。想像できるあらゆる業種で12,000以上のサイトを構築してきました。主要なプラットフォームすべてで、実際の災害と静かな成功の両方を十分に経験しているため、他の誰かから流用した比較表ではなく、本当の意見を持っています。
ショートリストです。
2026年における「フロントエンドホスティング」の実際の意味
ここは正確にしておく価値がある。カテゴリーが曖昧になってきたからだ。
2020年、フロントエンドホスティングとは:静的ファイルをデプロイして、CDNを得て、終わり。それだけ。今では「フロントエンドホスト」は SSR Node プロセスを実行し、エッジ関数を処理し、プレビュー環境を管理し、40個ブランチ全体で環境変数を同期させているかもしれない。これは CDN ではない。基本的には Git を喋る PaaS だ。
2026年に語る価値がある各ホストは、すべてそのより広い領域で動作している。もし「HTML ファイルをどこに置くのか」という考え方をしているなら、ここから先は読む必要がない。Cloudflare Pages の無料プランを選んで終わりだ。ただし、Next.js、Nuxt、SvelteKit、Remix、Astro、またはサーバーコンポーネントやエッジレンダリングを使っているものを実行しているなら、その選択は本当に重要だ。
良いものと悪いものを分ける3つの要素
- サーバーレス関数のコールドスタートレイテンシー(これは TTFB を何よりも傷つける)
- プラットフォームのビルドシステムがフレームワークをどれだけ理解しているか(まだすべてが Next.js App Router を流暢に対応しているわけではない)
- 価格の崖:無料ティアがどこで終わり、有料ティアが月£3,000のエージェンシークライアント向けに意味があるのか
Vercel:相変わらずのデフォルト、相変わらず高い
正直に言うと、Vercel は簡単な答えであり、同時に 2024年に私が最もクライアントとの請求書でもめた選択肢だ。
プロダクトは優秀だ。そこに実際の議論の余地はない。Next.js 統合は明らかに比類なく優れている。彼ら自身が Next.js を作ったからだ。エッジ関数のコールドスタートは一貫して50ms未満で動作する。プレビューデプロイメントは宣伝どおりに機能する。DX(開発者体験)はおそらくこのカテゴリーで最高だ、以上だ。
ただし、ここが問題だ。Hobbyティア以上の価格設定は、エージェンシー業務には本当に厳しい。Proは1メンバーあたり月20ドルで、一見まともだが、8人のチームに3つの別々のクライアントアカウントがあるとなると話は変わる。高トラフィックなeコマースクライアント向けのビルド時の帯域幅超過料金は、気を抜くと利益を吹っ飛ばす。
2023年末のことだが、Seahawkには結構重いRemixアプリをVercel Proで走らせているSaaSクライアントがいた。ダッシュボードルートの関数呼び出し数だけが原因で、月額180ドルの請求が6ヶ月で610ドルまで跳ね上がった。誰も気づかなかった。クライアントの会計担当者が指摘するまで。技術的には、Vercelが何か間違っているわけではない。だが、コミットする前にモデル化しておくべき類の話だ。
本当に適している人:予算をきちんと持つファンド調達済みのスタートアップ、Next.js App Routerプロジェクトでフレームワークネイティブなサポートが欲しい人、DXを真摯なビジネス投資として扱うチーム。
他を検討すべき人:コスト意識の高いフリーランサー、小〜中規模クライアントサイトを多く管理するエージェンシー、SvelteKitやAstroを使っていてVercel固有機能が不要な人。
Netlify:少し道を外した一つ
親愛の念を込めて言うが、Netlifyは基本的にこのカテゴリを発明した。他の誰もが本気を出す前から、アトミックデプロイとデプロイプレビューをやっていた。
問題は、2026年のNetlifyは2022年以降の決定をすべてプロダクト委員会で下したように見えることだ。機能は追加され、UIはごちゃごちゃになり、価格ティアは複雑になり、コアプロダクトは遅くなった。ビルド時間が悪化している。2024年末に同じNext.js 14アプリで非公式な比較を走らせたが、NetlifyはAverage 4分20秒のビルド、Vercelは2分45秒。壊滅的ではない。ただし目立つ。
Netlifyがまだ光る場面:フォーム(組み込みフォーム処理はマーケティングサイト向けに本当に便利)、CMS統合、そして静的サイト専用ならVercelより無料ティアが太っ腹な点。ローカルビジネスクライアント向けのGatsbyやEleventy サイトを走らせているなら、Netlify freeは完全に堅い。
一つ好きな点:Edge Functionsは過小評価されている。Denoベース、コールドスタートが短い、netlify devでのローカル開発シミュレーションは特定のワークフローではVercelより実は良い。バーミンガムのファッションブランド向けのヘッドレスShopifyプロジェクトで多用した。きれいに動いた。
適している人:マーケティングサイト、初期段階でロックインされて既存ワークフローがあるエージェンシー、NetlifyのCMSやフォーム機能に頼っている人。
検討対象外の人:ビルド速度を優先する人、SSR集約的なアプリを実行するチーム、現在の料金体系が理解しづらいと感じている人(実際に理解しづらい)。
Cloudflare Pages:静かに非常に優れた穴場
完全に正直に言うと、ここ18ヶ月間、Cloudflare Pagesは驚くほど多くのプロジェクトで僕のデフォルト推奨になっている。
無料ティアは異常なほど良い。無制限のサイト、無制限のリクエスト、無制限の帯域幅。確かに制限はある(無料では月500ビルドなど)が、無料ティアが必要なサイト向けなら、その制限は問題ない。
Workers統合がおもしろくなる部分だ。Cloudflareのエッジネットワークは世界最大のPoP数を持つもので、これはマーケティングの誇大広告ではなく、グローバル分散したオーディエンスのレイテンシに実際に影響を与える。クライアントのトラフィックの40%が東南アジアから来ているなら、Cloudflare Pagesはそれなりの差をつけてVercelより速く配信する。
トレードオフ:フレームワークサポートはまだ追い付いている段階だ。Next.js App Router、特にReact Server Componentsは、Pages上で波乱万丈の歴史を持っている。1年前よりは良く動くが、ストリーミングと特定のキャッシング動作周辺のエッジケースがあり、注意しなければ引っかかる。複雑なNext.js 15アプリにRSCの重い使用がある場合、徹底的なテスト前提なしでPagesにデプロイしようとは思わない。Astro、SvelteKit、純粋な静的サイトなら、完全に問題ない。
適している人:コスト意識の高いエージェンシー、グローバルオーディエンス、Astro/SvelteKit/Qwikプロジェクト、既にCloudflareエコシステムにいる人。
検討対象外の人:複雑なNext.js RSCセットアップを持つチーム、そのままエンタープライズSLAが必要な人。
Render:十分に話題にならない分別のある中間地点
Renderは十分なカバレッジを得ていない、おそらくVCマーケティング予算がないから。
Renderが得意とすること:フルスタックプラットフォームのように考えながらも、フロントエンドのみの作業でも本当に使いやすいです。Next.jsアプリをNodeサービスとして実行し、Postgresデータベースをセットアップし、バックグラウンドワーカーを追加して、すべてをダッシュボードから管理できます。価格設定も合理的です。これはVercelやNetlifyとは異なるメンタルモデルですが、特定のプロジェクトタイプにはまさに最適です。
静的サイト向けの無料枠は競争力があります。有料プランは1サービスあたり月額7ドルから始まり、Vercelのシート単位モデルより小規模ビジネスクライアントに説明しやすいです。
2024年初頭、フィンテックダッシュボードプロジェクトでRenderを初めて本格的に使いました。Next.jsフロントエンド、FastAPIバックエンド、セッション用Redis。すべてが一箇所にあり、環境変数の管理が共有できるのは本当に快適でした。バックエンド用のRailwayアカウントを別途持つ必要もなく、3つのプロバイダーから請求を繋ぎ合わせる必要もありません。
Renderの無料枠でのコールドスタートは、よく耳にする主な不満点で、これは正当です。アイドル状態から立ち上がるのに30~60秒かかることがあります。有料プランなら問題ありません。つまり、ユーザーが使うものには無料枠を使わないでください。
適している対象:フルスタックプロジェクト、フロントエンドとバックエンドをまたいで統合プラットフォームを望むチーム、コストを慎重に管理するソロ開発者。
他を検討すべき対象:純粋な静的サイト(Cloudflareの方が良く無料)、最高レベルの洗練されたDXが必要な人(Vercelの方が良い)。
Fly.io:実際にコントロールが必要な時
Fly.ioは典型的なフロントエンドホストではありません。しかし、永続的な接続、WebSocket、または重いサーバー側の状態を必要とするプロジェクトのカテゴリーが存在し、そこではFly.ioが単純に正解であり、他の選択肢は適していないため、ここに含めます。
Flyはコンテナを実行します。エッジコンピューティングに近い実コンテナを、35以上のリージョンで実行します。マネージドCDNデプロイパイプラインではありません。Dockerfileを書いてFlyが実行します。つまり、RemixアプリをSQLiteで実行したり(LiteFS を使用)、永続的なソケットサーバーを持つSvelteKitアプリを実行したりできます。これらはエッジファンクションモデルでは不可能な方法です。
学習曲線は急です。CLIは慣れが必要です。ドキュメントも改善中ですが、すでに何をしているかわかっていることを前提としているように感じることがあります。しかし、本当にわかっている場合、Flyは驚くほど強力です。
適しているのは:WebSocket集約型のアプリ、永続的なサーバー状態が必要なもの、コンテナに慣れた開発者で、マネージドプラットフォームの制約なしにグローバル展開したい場合。
他を検討すべき場合:初心者、ワンクリックデプロイを求める人、純粋な静的サイト。
実際に選ぶ方法(シンプルな判断プロセス)
- 純粋な静的サイトか(SSRなし、エッジ関数なし、HTML/CSS/JSのみ)?Cloudflare Pagesを使用、無料枠で完了。
- App RouterとRSCがコア機能のNext.jsか?Vercelを使用。それだけの価値がある、その特定のスタックに対して。
- SvelteKit、Astro、Nuxt、またはRemixを予算内で?まずCloudflare Pagesを試す。フレームワークのエッジケースに当たったらRenderに移る。
- バックエンドサービスが含まれ、ひとつのダッシュボードで管理したい?Renderを使用。
- 永続接続、WebSocket、または真のコンテナ制御が必要か?Fly.ioを使用。
- フリーランスで20個以上の小規模クライアントサイトを管理し、コストが主な判断基準か?静的サイトはCloudflare Pages、サーバーコンポーネントを含むものはRender、クライアントが特に必要とする場合のみVercel。
価格現実のチェック
誰もこれを本当に正直に話していない。Seahawk の現在のアクティブプロジェクト全体で、僕が実際に使っているのはこれだ:
- Vercel Pro:Next.js App Router ビルドを使用している2つのクライアント向けで予約済み。フレームワークサポートは妥協できない要件だ。コストは直接クライアントに請求する。
- Cloudflare Pages:11サイトは無料プラン、3サイトは$20/月の Pro プランを使用している。ビルド上限の理由による。
- Render:4つのプロジェクト、すべて$7/月の個別サービス層。合計:これら4つで月額およそ$28。
- Fly.io:WebSocket 要件を持つ2つのプロジェクト、合計月額およそ$18。
代理店の管理ポートフォリオ全体のホスティング支出の合計:20以上のライブサイトに対して月額120ドル未満。Vercel の請求はクライアント直接請求。
比較可能な数のプロジェクトで、これより大幅に多く支払っているなら、本当にセットアップを監査すべきだ。
FAQ
2026年の Vercel は価格に見合う価値があるか?
Next.js App Router プロジェクトに限定すれば、おそらくそうだ。コールドスタート性能、ビルド時間、フレームワークネイティブ機能が、Next.js があなたのスタックの中核である場合、そのコストを正当化する。それ以外は、ユーザー向けの改善に変換されないプレミアム料金を払っていることになる。
Cloudflare Pagesは高トラフィックサイトに対応できますか?
はい、十分に対応できます。Cloudflareのネットワークは日々数十億のリクエストを処理しています。無料プランの「無制限帯域幅」という謳い文句は、静的アセットに関しては本当です。唯一の大きな制約は、無料プランでの月500ビルドの上限と、複雑なNext.jsセットアップについて触れたフレームワーク互換性に関する注意点です。
AWS AmplifyやFirebase Hostingはどうですか?
含めなかった理由は、正直なところ、どちらも2026年における最新のフロントエンド開発に対する強い推奨にはならないからです。AmplifyのDXは常に専用プラットフォームに後れを取っていますし、Firebase HostingはすでにFirebaseエコシステムに深く関わっているプロジェクトに最適です。すでにそこにいるなら、それを使ってください。そうでなければ、私が挙げた5つのうちの1つから始めてください。
Netlifyは衰退しているのですか?
いいえ、ただし成長していないのです。プロダクトは相変わらず機能しています。同社は大規模なラウンドの資金調達を実施し、継続的に機能をリリースしています。しかし、2019〜2021年に持っていた「明らかに最高」というステータスを失っており、ほとんどの新規プロジェクトでは私は別のものを先に選びます。
フリーランスで始めたばかりの人にとって最良の選択肢は何ですか?
静的サイトならCloudflare Pages、サーバー側ロジックがあるならRender。どちらも無料プランを備えており、単なるトライアル目当てではなく、本当に使用可能です。そこから始めて、特定のプロジェクトが必要とする場合にのみVercelに移行してください。
---
ホスティングに関する話は、クライアント、エージェンシーの同業者、私たちのコミュニティDiscordの開発者たちと、週に最低2回はしています。誰もが毎回完璧にやっているわけではありません(私も確実にそうではありません)。しかし、去年使っていたものへのデフォルト設定に頼るのではなく上記の判断プロセスを使えば、かなりのお金を無駄にすることが少なくなり、14分間のダウンタイムの後そのクライアントと交わしたようなやり取りもずっと少なくなるでしょう。
適切なツールを選んだら、ホスティングする価値のあるものを作り上げましょう。
