Cloudflareのvinext：Vite上にAIで構築されたNext.js互換フレームワーク

vinextとは

vinext（「ヴィー・ネクスト」と発音）は、Vite上に構築されたNext.jsの代替としてそのまま使用でき、単一のコマンドでCloudflare Workersにデプロイできます。1人のエンジニアとAIモデルが約1,100ドルのトークン費用で1週間で一から再構築しました。

vinextが解決するデプロイ問題

Next.jsにはサーバーレスエコシステムでのデプロイ課題があります。OpenNextのようなツールは、Cloudflare、Netlify、AWS Lambdaなどのプラットフォーム向けにNext.jsの出力を適応させますが、Next.jsのビルド出力をリバースエンジニアリングする必要があり、バージョン間で壊れやすい実装につながります。Next.jsのアダプターAPIはまだ初期段階であり、開発時の問題を解決しません - next devはNode.jsでのみ実行されるため、Durable Objects、KV、AIバインディングなどのプラットフォーム固有のAPIを開発中にテストできません。

vinextの仕組み

vinextはNext.jsの出力を適応させる代わりに、Next.jsのAPIサーフェスをプラグインとしてVite上に直接再実装します。これにはルーティング、サーバーサイドレンダリング、React Server Components、サーバーアクション、キャッシング、ミドルウェアが含まれます。ViteのEnvironment APIにより、出力はあらゆるプラットフォームで実行できます。

セットアップは簡単です：

npm install vinext

スクリプト内のnextをvinextに置き換え、app/、pages/、next.config.jsは変更せずに維持します。

コマンド：

• vinext dev - HMR付き開発サーバー
• vinext build - 本番ビルド
• vinext deploy - Cloudflare Workersへのビルドとデプロイ

パフォーマンスベンチマーク

ベンチマークでは、共有の33ルートApp Routerアプリケーションを使用してvinextとNext.js 16を比較し、Next.jsのビルドではTypeScript型チェックとESLintを無効にしてViteの動作に合わせました。

本番ビルド時間：

• Next.js 16.1.6（Turbopack）：7.38秒（ベースライン）
• vinext（Vite 7 / Rollup）：4.64秒（1.6倍高速）
• vinext（Vite 8 / Rolldown）：1.67秒（4.4倍高速）

クライアントバンドルサイズ（gzip圧縮）：

• Next.js 16.1.6：168.9 KB（ベースライン）
• vinext（Rollup）：74.0 KB（56%削減）
• vinext（Rolldown）：72.9 KB（57%削減）

これらのベンチマークはコンパイルとバンドリング速度を測定しており、本番サービングパフォーマンスではありません。テストは単一の33ルートアプリを使用しており、すべての本番アプリケーションの代表的なサンプルではありません。

現在の状況

Cloudflareには既にvinextを本番環境で実行している顧客がいます。完全な方法論と過去の結果は公開されています。