フロントエンドのビルドツール
vite
esbuildを利用した事前バンドル
CommonJS または UMDをNative ESMにする
多くの内部モジュールを持つ ESM の依存関係を単一のモジュールに変換
バンドルせずに、差分があったファイルのみビルド
ESMでブラウザからimport
商用ではRollupでバンドル
Snowpackとの差
https://v2.vitejs.dev/guide/comparisons.html#snowpack
esbuild
Goで実装されているビルドツール
JSよりCPUを効率的に使用している
複数メモリでの並列処理
TypeScriptの型チェックは行われない
production-readyではない
esbuild-loaderでwebpackに組み込める
Turbopack
Webpackの後継
Rustで実装されている
Next.js 13で使用されている
人気のJavaScriptバンドルツール「webpack」の開発はなぜ終わり、後継として「Turbopack」の開発が始まったのか
https://www.publickey1.jp/blog/23/javascriptwebpackturbopack.html
swc
Rustで実装されている
バンドラーではなくトランスパイラ
spackを使用してバンドルする必要がある
Next.js 11~12で使用されている
tcs CLI
略
Rollup
JavaScriptで開発されている
モジュールバンドラー
ES6前提
commonjsはサポートされた無い
webpack
JavaScriptで開発されている
モジュールバンドラー
ES5前提
Rollupとwebpackの比較
https://zenn.dev/yuri/books/4391b9280f823061932c/viewer/0cb78e029300b8b0ed21
stateofjs build-tools
https://2022.stateofjs.com/ja-JP/libraries/build-tools/
フロントエンド最新ビルドツールを調べてみた
https://tech-blog.rakus.co.jp/entry/20210930/frontend
おまけ
astro
静的サイトビルダー
可能な限りビルド時にJSを排除してHTM + CSSにすることで高速を保つ
https://astro.build/