TurbopackはVercel社が2022年10月にNext.js Conf 2022で発表した、新しいJavaScriptバンドラです。Webpackの作者トビアス・コッパー氏自身が中心となって設計・実装しており、「Webpack 5の後継」と公式に位置付けられています。Rust言語で書かれ、SWCを内部で呼び出す形でJS/TS変換を担当します。Vercelによれば、Next.jsの大規模アプリでWebpack比で最大10倍程度のビルド速度向上を示すとされ、Next.js 13以降のNext.js Devコマンドで段階的に有効化が進められています。
この記事の目次
- 増分計算とキャッシュ設計
- Webpack作者による再出発
- Next.jsの開発体験を変える
- Vite・Webpackとの位置関係
- まとめ
増分計算とキャッシュ設計
Turbopackの最大の特徴は、Rustで書かれたインクリメンタル計算エンジン「Turbo Engine」を土台に持つ点です。TurbopackはNext.js 13公開時のドキュメントで、「関数の入出力をキャッシュし、入力が変わらなければ再計算しない」という関数粒度のメモ化を全工程に適用する設計だと説明されています。ファイル単位ではなく関数単位でビルド結果をキャッシュするため、巨大プロジェクトでも変更ファイルに関係する部分だけが再計算されます。
JS/TSの変換工程ではSWCが呼び出され、Rust同士で連携することでNode.jsプロセスを介さない高速パイプラインを構成します。Webpackで培われたloader／plugin相当の機能はTurbopack独自のプラグインモデルとして再設計されており、Webpackの巨大loaderエコシステムをそのまま使えるわけではありませんが、CSS・PostCSS・MDX・画像最適化など主要な変換は順次サポートされています。ベータ段階を経て少しずつ機能カバレッジを拡大している段階です。
Webpack作者による再出発
Turbopackは2022年10月25日、Next.js Conf 2022の基調講演で初めて公にされました。発表時の動画では、Webpack作者でVercel社員となっていたトビアス・コッパー氏自身が登壇し、「Webpackの限界を打ち破るために、ゼロから書き直した」と語ったのが印象的でした。Webpackは2012年に登場して以来10年以上にわたりフロントエンドの標準でしたが、JavaScript実装ゆえの速度の壁が長年指摘されてきた背景があります。
Turbopackの開発はVercelの社内チームで進められ、Next.js 13でnext dev --turboとして実験的に提供されました。その後Next.js 14、15と段階的に安定化され、開発サーバー（next dev）でのデフォルト化が視野に入っています。本番ビルド（next build）でのTurbopack化も段階的に進んでおり、長期的にはWebpackをNext.js内部から完全に置き換えるロードマップが示されています。Webpackからの世代交代を作者自身が手掛けるという、技術史的にも珍しいプロジェクトです。
Next.jsの開発体験を変える
Turbopackが主に投入されているのはNext.jsの開発体験向上です。next dev --turboで起動すると、ページ数が数百を超える大規模アプリでも数秒以内に開発サーバーが立ち上がり、ファイル編集に対するHot Module Replacement（HMR）が体感で即座に反映されます。Webpack時代に「初回コンパイルで30秒待つ」「保存のたびに数秒待つ」という体験が当たり前だった巨大Next.jsプロジェクトで、Turbopack導入後に開発スピードが大きく改善した事例がVercelから多数公開されています。
TypeScript・JSXの変換はSWC経由で行われ、CSS Modules・PostCSS・MDX・SVG読み込みといった日常的なアセットも段階的にサポートされています。本番ビルドではまだ機能不足な部分があり、特殊なWebpack pluginに依存しているケースでは移行できないこともありますが、「dev環境はTurbopack、本番ビルドはWebpack」というハイブリッド運用が現実的な落としどころとして広まりつつあります。Vercelは2024～2025年にかけて段階的にdefault化を進めると表明しています。
Vite・Webpackとの位置関係
TurbopackはNext.jsとの統合を前提に設計されており、現時点では「Next.jsの内部バンドラ」という色合いが強いツールです。ViteはEvan You氏が開発する汎用バンドラで、Vue・React・Svelte・SvelteKit・Astroなど幅広いフレームワークで使われ、本番ビルドではRollup、開発時はesbuildを組み合わせるハイブリッド構成を取っています。「フレームワーク中立」という点でViteとTurbopackは思想が異なります。
WebpackはTurbopackの公式な後継であり、長期的にはNext.js内部から段階的に置き換わっていく見込みです。ただしVue CLI・Storybook・既存の社内ツールチェーンなどWebpack前提のプロダクトはまだ多く、消えるわけではありません。esbuildとSWCはTurbopackと競合するのではなく協調する位置にあり、特にSWCはTurbopack内部のJS/TS変換を担う一部分として組み込まれています。「Rust製ネイティブビルド時代」の象徴的存在として、Turbopackは今後のフロントエンドの方向性を占う重要なプロジェクトです。
まとめ
TurbopackはWebpack作者トビアス・コッパー氏が中心となり、Vercelが2022年に発表したRust製バンドラです。関数粒度の増分計算とSWC連携でNext.jsの開発体験を一新し、Webpack 5の正式後継として段階的な置き換えが進んでいます。Vite・esbuild・SWCと連携・競合しながら、Rust製ネイティブビルド時代のフロントエンドを牽引する存在です。
※本記事はIT用語辞典の手書きドラフトです。公開前に最新情報・出典を確認のうえ加筆修正してください。
コメント