👌
esbuild による ng new のビルド時間計測
Angular のビルドに esbuild が組み込まれました。
これにより、Angular のビルドの高速化が期待できます。
実際に計測した結果を記載します。
計測内容
- Angular CLI v11 (11.2.17 esbuildなし)
- Angular CLI v13 (13.1.2 esbuildあり)
で ng new
でアプリケーションを作成します。
ng new のオプション
? Would you like to add Angular routing? (y/N) Y
? Which stylesheet format would you like to use? (Use arrow keys) CSS
そのアプリケーションに対して、ng build
を行った結果を測定します。
計測結果
キャッシュなしの状態でのビルド結果を比較します。
| Version | Build Time |
| ---- | ---- | ---- |
| v11 | 18998ms |
| v13 | 24058ms |
残念ながら、 ng new
の結果では大きな差異は見られませんでした。
複雑なビルドで試してみたいと思います。
Angular CLI v11
ビルド結果
Initial Chunk Files | Names | Size
vendor.js | vendor | 2.36 MB
polyfills.js | polyfills | 128.82 kB
main.js | main | 56.22 kB
runtime.js | runtime | 6.15 kB
styles.css | styles | 119 bytes
| Initial Total | 2.54 MB
Build at: 2021-12-31T09:31:10.748Z - Hash: 9cbc5e54a4a3e2df6745 - Time: 18998ms
Angular CLI v13
ビルド結果
Initial Chunk Files | Names | Raw Size | Estimated Transfer Size
main.ec79a7b1cc5749fc.js | main | 205.03 kB | 55.56 kB
polyfills.4e8decfcbe237b22.js | polyfills | 36.19 kB | 11.52 kB
runtime.33312de4debca1c6.js | runtime | 1.04 kB | 598 bytes
styles.ef46db3751d8e999.css | styles | 0 bytes | -
| Initial Total | 242.26 kB | 67.66 kB
Build at: 2021-12-31T09:37:40.592Z - Hash: f423a5919439dd87 - Time: 24058ms
Discussion