Webpackの70倍!Go言語で書かれたJavascriptバンドラー「esbuild」をベンチマークテストしてみた

esbuild
https://github.com/evanw/esbuild/

esbuildの特徴

複数モジュールの依存関係を解決し、1つにまとめるバンドラーは、現代のフロントエンド開発においてなくてはならないツールの1つ。


The State of JavaScript

上位5つに人気が集中し、なかでもWebpackのシェアは実に約60%に達しています。

今回ご紹介する「esbuild」は、Go言語で書かれた高速なバンドラーで、これらメジャーなツールとの性能比較(ベンチマークテスト)をやってみました。

公式のベンチマーク結果

計測方法は、three.jsライブラリを10回複製し、キャッシュなしで単一のバンドルをゼロから構築しています。なんと、Webpackに比べて70倍以上もビルド時間が圧縮されるなど、クレイジーな速度を誇っています。

なぜ、早いのか?

・Goというネイティブコードにコンパイルできる言語で書かれている
・パース、プリンティング、ソースマップの処理が完全に並列化されている
・すべての処理が、非常に少ないパスで実行され、コストのかかるデータ変換が不要
・コードは速度を重視し、不必要なアロケーションを回避している

Githubリポジトリより引用

実際に動かしてみる

$ git clone https://github.com/evanw/esbuild.git
$ cd esbuild
$ make bench-three

esbuildのブランチにある計測スクリプトを実行します。

Rollup.js

Built in 49s

real 49.95
user 54.59
sys 3.99

FuseBox

Built in 2m 56s 602ms

real 184.63
user 229.76
sys 15.46

Parcel

Built in 142.49s

real 154.52
user 305.49
sys 29.69

Webpack

Built in 56.95ms

real 58.75
user 67.11
sys 4.45

esbuild

Built in 770ms

real 1.28
user 2.49
sys 0.70

ビルド時間を見れば、結果は一目瞭然です。

すでにバンドラーのまわりにはエコシステムが確立され、単純な速度比較だけでは技術が選ばれる理由にはならないでしょう。それでも、かなりショッキングな性能差であるのは事実であり、それとともに、Go言語の可能性を感じさせてくれる結果ではないでしょうか。


コメントを読む

新着ピック  






















新着ニュース

東大卒プロゲーマー「ときど」はスランプに陥っていた——ウメハラからの助言、そしてたどり着いた「努力2.0」

5分でできるS3とCloudFrontを利用したセキュアな静的Webサイトの作り方 | Developers.IO

[初心者向け] AWS CDKのレイヤーについて調べてみた | Developers.IO

気化した過酸化水素で除染すればN95マスクも再利用可能に | TechCrunch Japan

Wheelsがハンドルとブレーキレバーがセルフクリーニングされる電動バイクを展開 | TechCrunch Japan

ロケット打ち上げスタートアップのSkyroraは消毒液とマスクの生産に注力 | TechCrunch Japan

AWSアカウント間でAmazon EventBridgeイベントを送受信してみた | Developers.IO

CloudFrontの作成や更新時間が約5倍高速になりました | Developers.IO

ポラロイドカメラが復活、新モデルPolaroid Nowが登場 | TechCrunch Japan

新型コロナ、過去2カ月の感染状況を比較した

市販の材料を使い1分で完成する医療用フェイスシールドの作り方をニューヨーク大学が無料公開 | TechCrunch Japan

「エスパーウィーク」は自宅で新ポケモン捕獲のチャンス 家で遊ぶ「ポケモンGO」まとめ

[オンラインハンズオン] はじめての自然言語処理(NLP)powered by LINE API Expert #jawsdays #jawsug #jawsdays2020 #LINE_API | Developers.IO

ソフトバンクGも出資の英OneWebが新型コロナで破産申請 74の衛星を残して

Looker 7でIDE(モデルやビューのWeb編集画面)のUIが改善されました #looker | Developers.IO

Lookerで「Liquid変数」を使ってWeb記事のURL情報をカスタマイズ #looker | Developers.IO

5分間で陽性がわかる米食品医薬局が新たに認可したAbbottの新型コロナ検査 | TechCrunch Japan

ソフトバンクなどからの追加資金を確保できずOneWebが破産を申請 | TechCrunch Japan

【小ネタ】スクリーンショットをカレントへ移動する処理をちょっと深掘り | Developers.IO

AIとビッグデータが新型コロナとの戦いで奇跡を起こすことはない | TechCrunch Japan

もっと見る
記事をPICKする
会員登録
Register
記事をPICKする

会員登録すると、もっと便利に利用できます。