Vercel料金最適化ガイド【個人開発者のコスト削減術を徹底解説】

Vercelの料金体系を正しく理解する【2026年最新プラン解説】

Vercelの3つの料金プラン概要

VercelはHobby（無料）・Pro（$20/月）・Enterprise（カスタム）の3つのプランを提供しています。2025年9月の大幅リニューアルにより、以前のプラン体系から大きく変わりました。

まず全体像を把握しましょう。

ここで最も重要なのは、Hobbyプランは商用利用不可という点です。個人開発でも広告収益やサブスクリプション課金があるプロダクトは、Proプラン以上が必須になります。

2025年9月の料金体系リニューアルで何が変わったか

Vercelは2025年9月に大幅な料金体系の変更を実施しました。主な変更点は以下の3つです。

• クレジットベースの課金導入：Proプランに月$20のクレジットが含まれ、超過分に適用できるようになった
• Enterprise機能のPro降格：SAML SSO（$300/月アドオン）やHIPAA BAA（$350/月アドオン）がProプランでも利用可能に
• 帯域幅の名称変更：「Bandwidth」から「Fast Data Transfer」に名称が変更され、計測方法も統一された

この変更により、Proプランのコスパは以前より向上しています。月$20のクレジットで小規模な超過分はカバーされるため、実質的な追加費用が発生するのは中〜大規模のプロジェクトからです。この基本構造は2026年8月現在も変わっていません。

2026年に入ってからの変更点【2026年8月時点】

2026年はビルド課金の仕組みが大きく変わりました。時系列で整理すると以下の通りです。

• 2026年2月〜：Proのビルドが「月間ビルド時間の枠」から分単位の従量課金へ移行開始。新規プロジェクトは高速なTurboマシンが既定に
• 2026年4月14日：ビルド内容に応じてマシンサイズを自動で割り当てるElastic build machinesが正式リリース（GA）。新規Proチームの既定に。ベータ期間中は約80%のプロジェクトで、より小さいマシンへの自動割り当てによりコストが下がった
• 2026年4月15日：Turboマシンが16%値下げされ、全ビルドマシンの単価が$0.0035/CPU分に統一（Standard 4vCPU＝$0.014/分、Enhanced 8vCPU＝$0.028/分、Turbo 30vCPU＝$0.105/分）
• 2026年8月25日：Speed Insightsに無料枠が登場（全プランで月1万イベントまで無料）

「ビルドのCPU分課金」は聞き慣れないかもしれませんが、計算はシンプルです。ビルド時間（分）× マシンのvCPU数 × $0.0035。例えば3分のビルドをStandardマシン（4vCPU）で行うと、3 × 4 × $0.0035 = 約$0.042です。月30回デプロイしても$1.26程度で、Proの$20クレジット内に収まります。なお、固定のStandardマシン＋オンデマンド同時ビルド無効で運用している場合、2026年8月時点ではビルドは課金対象外です。

見落としがちな「超過料金」の仕組み

Vercelの料金で最も注意すべきなのが超過料金です。Proプランの場合、含まれる枠を超えた分は従量課金されます。

単価はリージョンにより変動します（表は米国リージョン基準）。また、以前は「Edge Middleware呼び出し（$0.65/100万回）」という独立した課金項目がありましたが、現在のMiddlewareはFluid compute上の関数として実行され、呼び出し回数・Active CPU・メモリの3軸で課金されます。

特に危険なのは帯域幅（Fast Data Transfer）です。1 TBを超えると$0.15/GBが発生し、例えば月1.5 TBの転送量だと超過分500 GBで$75の追加費用になります。月額$20のプランのはずが、$20クレジットで相殺しきれず合計$75になる計算です。

Hobbyプランの隠れた制約「Fair Use Policy」

Hobbyプランは無料ですが、VercelのFair Use Policy（公正利用ポリシー）が適用されます。具体的には以下の制限があります。

• 帯域幅100 GB/月を超えるとサイトが一時停止される
• 商用利用が発覚した場合、強制的にProプランへの移行を求められる
• 関数のメモリは1 vCPU / 2 GB固定で変更不可
• 同時ビルドは1つまで

無料だからといって商用プロダクトを運用していると、ある日突然メールが届いてプランアップグレードを迫られる、ということが実際に起きます。

無料プラン（Hobby）でどこまでできるか？制限と活用法

Hobbyプランで個人開発を始めるメリット

とはいえ、Hobbyプランは個人開発のスタートには最適です。以下のようなケースなら、完全無料で運用できます。

• ポートフォリオサイトやブログ（月間PV 5万以下程度）
• 収益化前のMVP・プロトタイプ
• 個人の学習・実験用プロジェクト
• オープンソースプロジェクトのドキュメントサイト

100 GB/月の帯域幅は、1ページあたり1 MBと仮定すると約10万PV/月に相当します。月間1〜2万PVの個人ブログなら余裕で収まります。

Hobbyプランの具体的な制限値

Hobbyプランの制限を正確に把握しておくことが重要です。

Hobbyプランの「商用利用不可」を正しく理解する

Hobbyプランで最も誤解されやすいのが「商用利用不可」のルールです。Vercelの定義では、以下のいずれかに該当すると商用利用とみなされます。

• 広告収益を得ているサイト（Google AdSenseなど）
• 有料商品・サービスを販売しているサイト
• サブスクリプション課金があるSaaS
• 企業・法人のコーポレートサイト

逆に、アフィリエイトリンクが一切なく、収益化していない純粋な個人ブログやポートフォリオはHobbyプランで問題ありません。ただし、将来的に収益化する予定があるなら、最初からProプランで始めておくと後の移行がスムーズです。

Hobbyプランから卒業すべきタイミング

以下のいずれかに該当したら、Proプランへの移行を検討しましょう。

• 帯域幅が月80 GBを超えた（上限の80%）
• プロダクトから1円でも収益が発生し始めた
• チームメンバーが2人以上になった
• 関数のメモリ不足でタイムアウトエラーが頻発し始めた
• Preview Deploymentのパスワード保護が必要になった

僕（ぶべ）の場合、ShiftBのサイト開発を始めた当初はHobbyプランで運用していましたが、受講生の申し込みフォーム（＝商用利用）を設置した時点でProプランに切り替えました。月$20は個人開発者にとって決して小さくない額ですが、商用利用でのTOS違反リスクを考えると必要な投資です。

【シミュレーター】あなたのサイトのVercel月額をその場で概算する

ここまでの料金体系を踏まえて、あなたのサイトの規模だと月額いくらになるのかを概算してみましょう。サイトタイプを選んで月間PVを入力するだけでOKです。「詳細設定」を開けば、1PVあたりの転送量や関数呼び出し回数などの前提も細かく調整できます。

シミュレーターの計算ロジックはシンプルで、PV数 × 1PVあたりの各リソース消費量を、この記事で解説している2026年8月時点の単価（米国リージョン基準）に掛け合わせています。1PVあたりのEdge Requests数を「10〜25回」としているのは、1回のページ表示でHTML本体に加えてJS・CSS・画像・フォント・APIコールなど複数のリクエストが発生するためです。

注意点として、これはあくまで概算の目安です。CDNキャッシュのヒット率が高ければ関数呼び出しや転送量は大きく減りますし、Fluid computeのインスタンス共有によってメモリ課金も実際には下振れしやすくなっています。逆に、Botアクセスが多いサイトはPVに現れないEdge Requestsが積み上がることもあります。実際の使用量は、VercelダッシュボードのUsageページで必ず確認してください。

課金が跳ね上がる3大要因と対策

要因1：帯域幅（Fast Data Transfer）の超過

Vercelで最もコストが跳ね上がりやすいのが帯域幅です。以下のようなパターンで想定以上の転送量が発生します。

• 大きな画像の直接配信：最適化されていない画像（1枚2〜5 MB）をVercelのCDN経由で配信すると、100 PVで200〜500 MBを消費
• 動画ファイルの配信：動画をVercelから配信すると、1本10分の動画（約100 MB）が100回再生されるだけで10 GBを消費
• バズ・トラフィックスパイク：SNSでバズると短期間で数十GBの帯域幅を消費。Hobbyプランの場合はサイト停止、Proプランの場合は超過料金が発生

対策：大きなファイル（画像・動画・PDFなど）はCloudflare R2やAWS S3などの外部ストレージから配信しましょう。Cloudflare R2はエグレス（転送）料金が無料なので、帯域幅コストを大幅に削減できます。

要因2：サーバーレス関数の実行時間

Vercelのサーバーレス関数はCPU時間・メモリ・呼び出し回数の3つの軸で課金されます。以下のような処理が高コストの原因になります。

• 外部API待ち：AI APIの呼び出し（数秒〜十数秒）を含む関数は、待機時間分もCPU時間にカウントされる場合がある
• PDF生成・画像処理：サーバーサイドでの重い処理はCPU時間を大量消費
• N+1クエリ：データベースへの非効率なクエリで関数の実行時間が伸びる

対策：VercelのFluid Computeを有効化しましょう。Fluid Computeは関数インスタンスを再利用し、実際のコード実行時間のみ課金する仕組みで、20〜30%のコスト削減が見込めます。新規プロジェクトではデフォルトで有効ですが、既存プロジェクトは設定から手動で有効化する必要があります。

要因3：画像最適化とMiddlewareの見えないコスト

意外と見落とされがちなのが、画像最適化とMiddlewareのコストです。

画像最適化のコスト構造：

• ソース画像の変換：$0.05/1,000変換
• 画像キャッシュ読み取り：$0.40/100万回
• 画像キャッシュ書き込み：$4/100万回

例えば、ECサイトで1,000枚の商品画像をNext.jsのImageコンポーネントで表示する場合、初回アクセス時に1,000回の変換が発生し、レスポンシブ対応で複数サイズ生成されると実際は3,000〜5,000変換になることも。

Middlewareの罠：Middlewareは対象パスへのすべてのリクエストの前に実行されます。現在のMiddlewareはFluid compute上の関数として呼び出し回数・Active CPU・メモリで課金されるため、認証チェックやA/Bテスト、リダイレクト処理を全パスで行っていると、ページビューの数倍の関数実行が発生し、気づかないうちにコストが膨らみます。

対策：画像は事前にTinyPNGなどで圧縮し、10 KB以下の小さなアイコンにはNext.jsのunoptimizedプロップを使いましょう。Middlewareは必要最小限のパスにのみ適用するよう、matcher設定を厳密に定義してください。

実際の「請求ショック」事例

ShiftBの受講生から報告された実際の事例を紹介します。

• ケース1：ブログ記事がバズり、1日で帯域幅50 GBを消費。Proプランの月$20に加えて追加$7.50が発生（$20のクレジットで一部相殺）
• ケース2：画像ギャラリーサイトで画像最適化が月30,000変換に。追加$1.50（少額だが毎月積み上がる）
• ケース3：MiddlewareでBot対策を実装し、全リクエストを処理。月間の関数呼び出しが5,000万回を超え、呼び出し課金だけで追加$30が発生（Active CPU・メモリ課金も上乗せ）

個人開発者向けコスト最適化テクニック10選

テクニック1：静的生成（SSG）をデフォルトにする

Next.jsのページは、可能な限り静的生成（SSG）にしましょう。SSGページはビルド時にHTMLが生成され、Vercelのエッジネットワークからそのまま配信されるため、サーバーレス関数が一切呼ばれません。

// 良い例：静的生成（コスト最小）
// app/blog/[slug]/page.tsx
export async function generateStaticParams() {
  const posts = await getAllPosts();
  return posts.map((post) => ({ slug: post.slug }));
}

export default async function BlogPost({ params }: { params: { slug: string } }) {
  const post = await getPost(params.slug);
  return <Article post={post} />;
}

// 悪い例：毎回サーバーサイドレンダリング（コスト大）
// export const dynamic = "force-dynamic"; // これは避ける

テクニック2：ISRの再検証間隔を最適化する

ISR（Incremental Static Regeneration）を使う場合、再検証間隔（revalidate）の設定がコストに直結します。

• revalidate: 60（1分ごと）→ 1時間あたり60回の関数実行
• revalidate: 3600（1時間ごと）→ 1時間あたり1回の関数実行

つまり、再検証間隔を1分から1時間に変更するだけで、関数実行コストが60分の1になります。ブログやドキュメントサイトなら、revalidate: 3600（1時間）以上で十分なケースがほとんどです。

// ISRの再検証間隔を最適化
// app/blog/[slug]/page.tsx
export const revalidate = 3600; // 1時間ごとに再検証

// さらにコスト削減するなら、オンデマンド再検証を使う
// app/api/revalidate/route.ts
import { revalidatePath } from "next/cache";
import { NextRequest } from "next/server";

export async function POST(request: NextRequest) {
  const { path } = await request.json();
  revalidatePath(path);
  return Response.json({ revalidated: true });
}

テクニック3：Fluid Computeを有効化する

Fluid ComputeはVercelが提供するサーバーレス関数の最適化機能で、有効化するだけで20〜85%のコスト削減が期待できます。仕組みは以下の通りです。

• 関数インスタンスをリクエスト間で再利用（コールドスタートの削減）
• I/O操作（DB問い合わせ、API呼び出し）の待機中はCPU時間にカウントしない
• 1つのインスタンスで複数リクエストを同時処理

Vercelダッシュボードの Settings → Functions → Fluid Compute から有効化できます。2025年4月以降の新規プロジェクトではデフォルトで有効ですが、それ以前に作成した古いプロジェクトは手動で有効化が必要です。

テクニック4：画像を外部サービスで最適化する

Next.jsのImageコンポーネントはデフォルトでVercelの画像最適化APIを使いますが、これに課金されます。以下の代替手段があります。

• 事前最適化：アップロード前にTinyPNGやSquooshで圧縮し、unoptimizedプロップを使用
• 外部ローダー：Cloudflare ImagesやCloudinaryをNext.jsのカスタムローダーとして設定
• セルフホストの最適化：sharpをインストールし、ビルド時に画像を最適化

// next.config.ts で外部画像ローダーを設定
const nextConfig = {
  images: {
    loader: "custom",
    loaderFile: "./lib/image-loader.ts",
  },
};

// lib/image-loader.ts
export default function cloudflareLoader({
  src,
  width,
  quality,
}: {
  src: string;
  width: number;
  quality?: number;
}) {
  const params = `width=${width},quality=${quality || 75},format=auto`;
  return `https://your-domain.com/cdn-cgi/image/${params}/${src}`;
}

テクニック5：大きなファイルはVercel外で配信する

動画、PDF、大きな画像（1 MB以上）、ダウンロード用ファイルは、Vercelから配信すると帯域幅を大量に消費します。

• Cloudflare R2：エグレス料金無料。S3互換APIで使いやすい。月$0.015/GB/月のストレージ料金のみ
• AWS S3 + CloudFront：大規模配信向け。CDN経由で$0.085/GB程度
• YouTube/Vimeo埋め込み：動画は外部プラットフォームに任せるのが最もコスト効率が良い

テクニック6：Middlewareのmatcherを限定する

Middlewareをすべてのリクエストで実行するのは、コスト面で非常に非効率です。matcher設定で必要なパスのみに限定しましょう。

// middleware.ts
// 悪い例：すべてのリクエストで実行
export function middleware(request: NextRequest) {
  // 認証チェック
}

// 良い例：必要なパスのみに限定
export const config = {
  matcher: [
    "/dashboard/:path*",
    "/api/:path*",
    // 静的アセット・画像・faviconは除外
    "/((?!_next/static|_next/image|favicon.ico).*)",
  ],
};

テクニック7：prefetchを制御する

Next.jsのLinkコンポーネントはデフォルトでプリフェッチが有効です。つまり、ビューポート内に表示されたリンク先のページを事前に読み込みます。これはUXの向上には効果的ですが、不要な関数呼び出しと帯域幅消費の原因になります。

// 重要でないリンクはprefetchをオフに
import Link from "next/link";

// ナビゲーションの主要リンクはprefetch有効（デフォルト）
<Link href="/dashboard">ダッシュボード</Link>

// フッターやサイドバーのリンクはprefetch無効
<Link href="/terms" prefetch={false}>利用規約</Link>
<Link href="/privacy" prefetch={false}>プライバシーポリシー</Link>

テクニック8：Vercelのスペンド管理を設定する

Proプランではスペンド管理（Spend Management）機能が使えます。月の予算上限を設定しておけば、超過料金が一定額に達した時点でアラートを受け取ることができます。

• ダッシュボードの Settings → Billing → Spend Management から設定
• Hard Limitを設定すると、上限に達した時点でリソースが制限される
• Soft Limitを設定すると、メール通知のみで動作は継続

個人開発者なら、まずはHard Limitを$50/月に設定しておくことをおすすめします。Proプランの$20 + 超過$30で、最大$50/月に抑えられます。

テクニック9：不要なPreview Deploymentとビルド課金を削減する

VercelはデフォルトですべてのGitブランチ・PRに対してPreview Deploymentを作成します。Hobbyプランでは1日100デプロイ・同時1ビルドの制限を圧迫し、Proプランでは2026年から始まったビルドのCPU分課金（$0.0035/CPU分）に直結します。

• Vercelダッシュボードの Settings → Git で、Preview Deploymentの対象ブランチを限定
• vercel.jsonでgithub.enabled: falseを設定し、手動デプロイに切り替え
• 開発中はローカルでvercel devを使い、不要なデプロイを避ける
• Proプランでビルド課金を抑えたいなら、Settings → Build and Deployment でビルドマシンを固定のStandardにし、オンデマンド同時ビルドを無効化する（この構成なら2026年8月時点でビルドは課金対象外。ただしビルド速度と引き換え）

テクニック10：キャッシュ戦略を最適化する

適切なキャッシュ設定は、帯域幅とサーバーレス関数の両方のコスト削減に直結します。

// APIルートでキャッシュヘッダーを設定
// app/api/posts/route.ts
export async function GET() {
  const posts = await getAllPosts();

  return Response.json(posts, {
    headers: {
      // CDNキャッシュ：1時間、クライアントキャッシュ：5分
      "Cache-Control": "public, s-maxage=3600, stale-while-revalidate=300",
    },
  });
}

s-maxageはVercelのCDNキャッシュ期間、stale-while-revalidateはキャッシュ期限切れ後もバックグラウンドで更新しつつ古いキャッシュを返す設定です。これにより、同じデータへのリクエストで関数が呼ばれる回数を大幅に減らせます。

Vercel vs 他のホスティングのコスト比較

主要4サービスの料金プラン比較【2026年8月最新】

Vercelと主要な競合サービスの料金を比較します。為替レートは1ドル＝150円で換算しています。なお2026年は競合側の動きが激しく、Netlifyは2026年4月にクレジット制へ全面移行（無料枠は帯域換算で約15GB相当に大幅縮小）、CloudflareはPagesからWorkersへの統合が進み（2026年3月に静的アセット・SSRなどで機能同等に到達）、Railwayは$1クレジット付きの無料プランを新設しました。

Netlifyの現行プランはFree（300クレジット）／Personal $9（1,000クレジット）／Pro $20（3,000クレジット・メンバー無制限）という構成で、帯域・ビルド・関数実行などをすべてクレジットで消費する仕組みです。2026年7月にはProの上位に5段階のクレジットティアも追加されました。旧来の「Free 100 GB・Pro 1 TB」という帯域枠はもう存在しない点に注意してください。

帯域幅コストで比較すると？

月間1 TBの帯域幅を使った場合のコストを比較してみましょう。

帯域幅だけで見ると、Cloudflareの安さは別格です。逆に、クレジット制になったNetlifyは大量配信でむしろ割高になりました。1 TBクラスの帯域ではVercel Proの「1 TB込み」は健闘しているとも言えます。ただし、Next.jsとの互換性やDX（開発体験）を含めた総合評価では話が変わってきます。

Next.jsとの相性で比較する

VercelはNext.jsの開発元であり、Next.jsのすべての機能が設定ゼロで動作します。他のサービスでは、一部のNext.js機能に制限がある場合があります。

結局どのサービスを選ぶべきか？ケース別ガイド

僕（ぶべ）の結論は以下の通りです。

• Next.jsメインの個人開発 → Vercel一択。DXの良さと機能の完全対応が圧倒的。月$20は「時間を買う」投資
• 静的サイト・帯域幅重視 → Cloudflare Workers（旧Pages）。静的アセットの帯域無制限・月$5からは破格。Next.jsもOpenNextアダプタで主要機能が動くようになったが、セットアップの手間と細かい非互換は残る
• コスト最優先・機能は最低限でOK → Cloudflare Workers Free。無料で無制限帯域幅は他にない。Netlify Freeは2026年4月の改定で帯域換算 約15 GB相当に縮小したため、無料運用の受け皿としては厳しくなった
• バックエンド込みのフルスタックアプリ → Railway。データベースもコンテナも1つのプラットフォームで完結。egressは$0.05/GBに値下がりしたが、大量配信には引き続き注意

Next.jsプロジェクトの最適化でVercel費用を削減する方法

レンダリング戦略の見直しで関数実行を最小化

Next.jsのレンダリング戦略は、Vercelのコストに直結する最重要ポイントです。各レンダリング方式のコスト効率を理解しておきましょう。

鉄則：まずSSGで作れないか考える → 更新が必要ならISR → リアルタイム性が必要な部分だけSSR。この優先順位を守るだけで、関数実行コストを80%以上削減できるケースがあります。

ISRでFast Origin Transferを95%削減した事例

あるブログサイトの事例では、すべてのページをSSRで配信していたところ、90人の訪問者でFast Origin Transfer（オリジンからCDNへの転送量）が約280 MBに達していました。これをISRに切り替えたところ、同じトラフィックで15 MB以下に削減できました。95%の削減です。

具体的な設定変更は以下の通りです。

// Before: SSR（毎リクエストでサーバー処理）
export const dynamic = "force-dynamic";

// After: ISR（1時間ごとに再検証）
export const revalidate = 3600;

// さらに最適化：オンデマンド再検証
// コンテンツ更新時のみ再検証をトリガー
// app/api/revalidate/route.ts
import { revalidateTag } from "next/cache";

export async function POST(request: Request) {
  const { tag } = await request.json();
  revalidateTag(tag);
  return Response.json({ success: true });
}

バンドルサイズの最適化でCDN転送量を削減

JavaScriptバンドルサイズの削減は、帯域幅コストに直接効きます。以下のチェックリストで最適化しましょう。

• @next/bundle-analyzerで分析：npm run build後にバンドルの内訳を可視化
• Dynamic Importの活用：ページ読み込み時に不要なコンポーネントはnext/dynamicで遅延読み込み
• 不要なライブラリの除去：moment.js → date-fns、lodash → lodash-es（tree-shakable版）に置き換え
• フォントの最適化：next/fontを使ってフォントをセルフホスト化し、外部リクエストを削減

バンドルサイズを100 KB削減できれば、月間10万PVのサイトで約10 GB/月の帯域幅節約になります。

APIルートの最適化で不要な関数呼び出しを減らす

APIルートの設計もコストに影響します。以下のパターンに気をつけましょう。

• ポーリングをWebSocketに置き換え：1秒ごとのポーリングは1日86,400回の関数呼び出しを生む。リアルタイム通信はSupabase RealtimeやPusherを使う
• バッチ処理：複数のAPI呼び出しを1つにまとめる。5回のAPIリクエストを1回にすれば、関数呼び出し回数が80%減
• クライアントサイドキャッシュ：SWRやReact QueryのstaleTimeを適切に設定し、不要な再フェッチを防ぐ

// SWRでキャッシュを最適化
import useSWR from "swr";

function Dashboard() {
  const { data } = useSWR("/api/stats", fetcher, {
    refreshInterval: 60000,     // 1分ごとに更新（5秒ではなく）
    dedupingInterval: 30000,    // 30秒間は重複リクエストを防ぐ
    revalidateOnFocus: false,   // タブフォーカスでの再検証を無効化
  });

  return <StatsDisplay data={data} />;
}

ShiftBのリアルな月額コストと最適化の記録

ShiftBのVercel利用状況

ShiftB（このサイト）はNext.js + Vercel Proで運用しています。コンテンツは記事、コースページ、受講生用ダッシュボードなど、約200ページ以上あります。

現在のVercel月額コストは以下の通りです。

この記事で紹介した最適化テクニックを実践した結果、Proプランの基本料金$20だけで収まっています。超過料金はゼロです。

最適化の前後で何をしたか

実は最適化前は月額$35〜45程度かかっていました。以下が改善のタイムラインです。

• 2025年6月：ShiftBをVercel Proで運用開始。月額$20 + 超過$10〜15程度
• 2025年8月：記事ページをSSR → ISR（revalidate: 3600）に変更。関数実行コスト50%減
• 2025年10月：画像をCloudflare R2経由で配信するよう変更。帯域幅30%減
• 2025年12月：Fluid Computeを有効化。関数コストさらに25%減
• 2026年1月：Edge Middlewareのmatcherを限定。Edge呼び出し70%減
• 2026年3月：バンドルサイズ最適化（moment.js除去、Dynamic Import導入）。帯域幅15%減
• 2026年4月：ビルド課金の刷新（Elastic GA）にあわせてビルドマシン設定を見直し。固定Standard＋オンデマンド同時ビルド無効の構成にして、ビルド課金の発生を回避

これらの積み重ねで、月額$35〜45 → $20固定に削減できました。年間換算で約$180〜300（約27,000〜45,000円）の節約です。

個人開発者として学んだ3つの教訓

ShiftBの運用を通じて学んだ教訓を共有します。

• 教訓1：最初からSSGファーストで設計する。後からSSRをSSGに変更するのはリファクタリングコストが高い。最初から「このページは本当にSSRが必要か？」と問いかける習慣をつける
• 教訓2：スペンド管理は初日に設定する。Proプランに切り替えたらその日のうちにHard Limitを設定。僕は$50に設定しており、一度も超えていない
• 教訓3：Vercelダッシュボードの使用量グラフを週1で確認する。異常なトラフィックや関数実行を早期発見できる。月末に請求書を見て驚くのではなく、週次で監視する

よくある質問（FAQ）

Q1. Vercelの無料プラン（Hobby）で商用サービスを運営できますか？

いいえ、できません。Hobbyプランは明確に商用利用不可です。広告収益、有料プラン、サブスクリプション課金など、1円でも収益が発生するサービスはProプラン（$20/月）以上が必須です。違反が検出されると、プランアップグレードを求める通知が届き、応じない場合はサービスが停止される可能性があります。

Q2. Vercel Proプランの$20/月で本当に足りますか？

多くの個人開発プロジェクトでは足ります。Proプランには1 TB/月の帯域幅と$20/月の超過クレジットが含まれます。月間PVが10万以下で、この記事の最適化テクニックを実践すれば、基本料金$20だけで運用可能です。ShiftBも実際に$20/月で収まっています。ただし、画像が多いECサイトや、サーバーレス関数を多用するアプリは追加料金が発生しやすいので注意が必要です。

Q3. VercelからCloudflare（Workers）に移行すべきですか？

Next.jsを使っているなら、基本的にはVercelのままが良いでしょう。VercelはNext.jsの全機能を設定ゼロで使える唯一のプラットフォームです。ただし、静的サイトがメインで帯域幅コストが問題なら、Cloudflareへの移行は合理的な選択です。なお、Cloudflareでは新規プロジェクトの受け皿がPagesからWorkersに移り、Next.jsは@opennextjs/cloudflareアダプタ経由でのデプロイが標準になりました。特に月間帯域幅が1 TBを超えるサイトでは、帯域幅無料のCloudflareに移行することで数十〜数百ドル/月の節約が可能です。

Q4. Vercelの請求が予想より高い場合、どう対処すればいいですか？

まずダッシュボードのUsageページで原因を特定しましょう。以下の手順で対処できます。

• Settings → Usage で各リソースの使用量を確認
• 帯域幅が原因なら大きなファイルを外部配信に切り替え
• 関数実行が原因ならSSGやISRへの移行を検討
• Spend ManagementでHard Limitを設定して再発を防止
• Vercelサポートに連絡して、一時的な課金のクレジット付与を相談（対応してくれるケースがある）

Q5. 個人開発者がVercelに支払う平均月額はいくらですか？

ShiftBの受講生データでは、平均$15〜25/月（約2,250〜3,750円）です。内訳としては、約40%がHobbyプラン（$0）、約50%がProプラン（$20）、約10%がProプラン+超過料金（$25〜50）です。ほとんどの個人開発者はProプランの基本料金で収まっています。

Q6. Vercelの料金は今後も変わりますか？

変わり続けると考えておくべきです。2025年9月のクレジット制導入に続き、2026年もビルド課金の刷新（2月〜4月）、Turboマシンの値下げ（4月）、Speed Insightsの無料枠追加（8月）と、数ヶ月単位で改定が続いています。値上げ一辺倒ではなく実質値下げになる変更も多いのが最近の傾向ですが、課金の「軸」自体が変わると想定外の請求につながりやすいので、公式のChangelogとPricingページを定期的に確認し、Spend Managementで上限を設定しておくのが確実な自衛策です。NetlifyやRailwayなど競合も2026年に課金モデルを大きく変えており、業界全体で料金体系の再編が続いています。

Q7. Vercelの料金を経費として計上できますか？

はい、個人事業主・法人なら可能です。Vercelの利用料は「通信費」または「ソフトウェア利用料」として全額経費計上できます。Proプラン年間$240（約36,000円）をはじめ、超過料金もすべて経費です。ドルでの決済になるため、支払日のレートで円換算して記帳します。確定申告の際はクレジットカード明細とVercelの請求書を両方保管しておきましょう。