Angular v17.2 でパッケージマネージャーとして「Bun」がサポートされたので性能を検証する
Angular v17.2 で Bun が利用可能に
Angular v17.2 でひっそりと高速なパッケージマネージャーである Bun が Angular CLI でサポートされました。
これにより Angular アプリーケーションを Bun でインストールしたパッケージや Bun コマンド経由で利用できるようになります。
基本的に Bun は npm と互換性があり、package.json を参照してnode_modulesにパッケージをインストールできます。
従来のパッケージマネージャーに比べパッケージのインストールが高速なため、Angularアプリの開発効率か向上する可能性を秘めています。
というわけで、パッケージマネージャーごとにどのくらいパフォーマンスの違いがあるのかを検証しました。
パフォーマンス計測方法
Angular CLI で利用できるパッケージマネージャーの Bun、npm、yarn、pnpm でインストールとビルド時間を検証します。
以下のコマンドでAngularアプリを作成し、SCSS スタイリング、サーバーサイドレンダリングなしの設定としました。
- 例. Bun で Angular アプリを作成するコマンド
bun create @angular bun-demo --style scss --ssr false
計測環境を揃えるために GitHub Actions上で行い、各パッケージマネージャーによるインストールとビルドの時間を比較しました。
インストール時はロックファイルの参照し、キャッシュは利用していません。
また、実行時間はtimeコマンドをコマンドの実行から終了までとしています。
計測結果
インストールコマンドの実行時間は、yarn < npm < pnpm < bunの順に速くなりました。特に bun はわずか1.3秒と圧倒的に高速でした。
| 実行時間（秒） | 1回目 | 2回目 | 3回目 | 平均 |
|---|---|---|---|---|
| npm | 13.327 | 11.878 | 11.172 | 12.1 |
| yarn | 17.359 | 16.814 | 19.225 | 17.8 |
| pnpm | 4.823 | 4.619 | 4.112 | 4.5 |
| bun | 1.232 | 1.417 | 1.393 | 1.3 |
一方でビルドや開発用サーバーの起動時間には、顕著な差は見られませんでした。あくまでパッケージマネージャー経由で @angular-devkitの機能を利用しているためです。
利用した感想
Bun はインストール時間が大幅に短縮できるため、依存関係の更新が頻繁に発生するCIで特に効果的だと感じました。
一方でビルドやサーバー起動は Bun の機能を利用していないため、Angularのエコシステム内の機能で完結できることが改めて分かりました。
検証を行う中で GitHub Actions でのワークフローも揃っていると感じたので、今後利用する選択肢としても考えるのもありかもしれません。
Discussion