動的画像最適化のコスト比較：Cloudflare Images vs Next.js Image Optimization vs Cloudinary

Webおよびモバイルアプリ（Next.js、Flutterなど）で高速なユーザー体験を提供するため、**動的画像最適化（WebP/AVIF変換、自動リサイズ、グローバルCDN配信）**は不可欠です。しかし、トラフィックが増加するにつれて、画像処理およびEgress転送量の請求額は急激に増大します。

本記事では、業界で広く利用されているCloudflare Images、Next.js Image Optimization (Vercel)、およびCloudinaryの3つのソリューションにおける課金構造を詳細に分析します。

要約

• Cloudflare Images: 元画像10,000枚あたり$5/月 + 配信100,000回あたり$1。**CDN Egress費用が完全無料（$0）**である点が最大のメリットです。
• Next.js (Vercel): Vercel Pro（$20/月）で1,000枚のソース画像最適化が無料。超過分は1,000枚ごとに$5。さらに**Vercel Egress費用（$0.15/GB）**が加산されます。
• Cloudinary: クレジット制。Plusプラン（$99/月、225クレジット）で、1クレジット＝1,000回変換または1GB Egressまたは1GBストレージとなります。
• 結論: 配信回数とEgressが多いサービスでは、Cloudflare Imagesが80%〜95%以上安価です。

1. 料金体系の実測比較

10,000枚の元画像、平均最適化画像サイズ150KBの場合の月額コスト試算：

2. Next.jsにおけるCloudflare Imagesカスタムローダー

// cloudflareLoader.ts
export default function cloudflareLoader({ src, width, quality }: { src: string; width: number; quality?: number }) {
  const accountHash = process.env.NEXT_PUBLIC_CLOUDFLARE_ACCOUNT_HASH;
  return `https://imagedelivery.net/${accountHash}/${src}/w=${width},q=${quality || 75}`;
}

// next.config.js
module.exports = {
  images: {
    loader: 'custom',
    loaderFile: './cloudflareLoader.ts',
  },
};

結論

画像配信量とEgress帯域が大きいサービスでは、Cloudflare Imagesを採用することでインフラ費用を大幅に削減できます。