webpack vs Rollup: CIビルドにどちらのバンドラーを使うべきか？

webpackは広大なloader/プラグインエコシステムを持つ重量級のアプリバンドラーです。Rollupはより軽量で、tree-shakingされたライブラリ出力に好まれます。

webpackは複雑なアプリケーション向けに作られた、成熟した高度に設定可能なバンドラーで、loader、code-splitting、巨大なプラグインエコシステムを備えています。Rollupはクリーンでtree-shakingされた出力に注力し、ライブラリを公開する際の一般的な選択肢です。

CIでの挙動

webpackは複雑なアプリケーションビルドを処理します - 多数のentry point、高度なcode-splitting、あらゆるアセット種別のloader - ただし設定が重く、ビルドが遅くなる代償があります。Rollupはよりシンプルな設定で、小さくよくtree-shakingされたバンドルを生成するため、ライブラリの定番であり (そしてViteの本番ビルドの背後にあるエンジンです)。出力対象で選びましょう: アプリ vs ライブラリ。

高速化する

ビルドと依存関係をlockfileをキーにcacheし、サポートされている場合は永続キャッシュを使いましょう。どちらもCI runner上で動作します。より高速なマネージドrunnerは、重いwebpackビルドの実時間を削減します。

結論

多くのアセット種別と分割ポイントを持つ複雑なアプリをバンドルするなら: webpack。ライブラリを公開する、または軽量でtree-shakingされた出力が欲しいなら: Rollup。多くのチームはViteを通じて自動的にRollupの出力を得ています。

関連ガイド