【イーエスビルド】

esbuild とは?

最終更新:
💡 ビルドの待ち時間をぐっと短く!Go製の高速バンドラ

Go言語で書かれた、Web向けの高速なバンドラ。JavaScript・TypeScript・CSSなどをまとめて、圧縮(ミニファイ)や変換まで1つのツールで行える。

📌 このページのポイント
JavaScriptバンドラ ビルド速度比較 three.js 10個分のバンドル時間(短いほど高速・esbuild公式ベンチマーク) webpack 5 Rollup 4 + terser Parcel 2 esbuild 0s 10s 20s 30s 40s 41.21秒 34.10秒 14.91秒 0.39秒 webpack 5の約106分の1の時間 計測環境: 6コアの2019年製MacBook Pro(公式FAQより) Go製・並列処理などで高速
各バンドラのビルド時間の比較(esbuild公式ベンチマーク、three.js 10個分)
ひよこ ひよこ
esbuildって何がそんなに速いの?
ペンギン先生 ペンギン先生
公式のFAQは理由を4つ挙げているよ。①Goで書かれていて、ネイティブコードとして動く。②解析とコード生成を、複数のCPUコアで並列に処理する。③既存のライブラリに頼らず、全部を一から書いている。④メモリの使い方を工夫して、コード全体をたどる回数を減らしている。1つの決め手というより、この組み合わせなんだ
ひよこ ひよこ
どのくらい速いの?具体的に教えて!
ペンギン先生 ペンギン先生
公式サイトのベンチマークでは、three.jsというライブラリを10個分まとめて、圧縮とソースマップ付きで出力する処理が、esbuildで0.39秒。同じ条件でParcel 2は14.91秒、Rollup 4+terserは34.10秒、webpack 5は41.21秒だよ。ただしこれは作者が6コアの2019年製MacBook Proで測った結果で、プロジェクトの内容や設定によって差は変わるんだ
ひよこ ひよこ
じゃあみんなesbuildを使えばいいのに、なんでほかのツールも使われてるの?
ペンギン先生 ペンギン先生
esbuildがやらないと決めていることがあるからだよ。TypeScriptの型チェックはしないので、tscを別に動かす必要がある。ホットモジュールリロード(HMR)や、VueやSvelteなどほかの言語の対応も、本体には入れない方針なんだ。それにバージョンはまだ1.0前で、作者は今は積極的な機能追加をしていないと書いている。必要な機能がそろっているかを見て選ぶことになるね
ひよこ ひよこ
Viteでも使われてるんだよね?
ペンギン先生 ペンギン先生
以前はそうだったよ。Viteはもともと、開発中の高速な変換にesbuild、本番ビルドにRollupという2つのツールを使っていたんだ。でも2026年3月に出たVite 8からは、Rust製のRolldownという1つのバンドラにまとめられた。古い記事には「Viteの中身はesbuild」と書かれていることがあるから、どのバージョンの話かに気をつけてね
ペンギン
まとめ:ざっくりこれだけ覚えればOK!
「esbuild」って出てきたら「Go製の高速なJavaScriptバンドラ」と思えればだいたいOK!
📖 おまけ:英語の意味
「esbuild」 = ES + build
💬 ESはECMAScript(JavaScriptの仕様名)の略として使われる表記で、buildは「組み立てる」。名前の由来についての公式の説明は、ここでは確認していないよ

参考資料

← 用語集にもどる