Nextjs Turbopack

Next.jsとTurbopack

Next.js 16+ではローカル開発にデフォルトでTurbopackを使用します。Rustで書かれたインクリメンタルバンドラーで、dev起動とホットアップデートを大幅に高速化します。

使用タイミング

• Turbopack（デフォルトdev）: 日常の開発に使用。コールドスタートとHMRが特に大規模アプリで高速。
• Webpack（レガシーdev）: TurbopackのバグやdevでWebpack専用プラグインに依存する場合のみ使用。--webpack（またはNext.jsバージョンにより--no-turbopack、リリースのドキュメントを確認）で無効化。
• 本番: 本番ビルド（next build）はNext.jsバージョンによりTurbopackまたはwebpackを使用する場合がある。バージョンに応じた公式Next.jsドキュメントを確認。

使用場面: Next.js 16+アプリの開発やデバッグ、遅いdev起動やHMRの診断、本番バンドルの最適化。

仕組み

• Turbopack: Next.js dev用のインクリメンタルバンドラー。ファイルシステムキャッシュを使用するため再起動が大幅に高速化（例: 大規模プロジェクトで5〜14倍）。
• devでデフォルト: Next.js 16以降、next devは無効化しない限りTurbopackで実行。
• ファイルシステムキャッシュ: 再起動時に以前の作業を再利用。キャッシュは通常.next配下。基本的な使用では追加設定不要。
• Bundle Analyzer（Next.js 16.1+）: 実験的なBundle Analyzerで出力を検査し重い依存関係を見つける。configまたは実験フラグで有効化（バージョンに応じたNext.jsドキュメントを参照）。