フリーキーズ | 独学プログラミング

JavaScript/TypeScriptの超高速実行環境Bunを使ってみよう

最終更新日
【画像】JavaScript/TypeScriptの超高速実行環境Bunを使ってみよう

ここ最近、多くのプロジェクトでTypeScriptが使われていることもあり、JavaScriptとTypeScriptのパッケージ管理ツールやランタイム(実行)環境の進化が目覚ましい勢いです。
ランタイム環境であればNode.jsが代表的ですが、Denoというセキュアな環境も使われるようになっています。

さらに今回紹介するBunです。
かわいい肉まんロゴが特徴的な超高速な実行環境です。実際に触って確かめてみましょう。

Bunとは

Bunは、2024年4月現在バージョン1.1がリリースされたばかりのJavaScript/TypeScript実行環境です。
ただの実行環境というわけでなく、パッケージマネージャーやバンドラー、さらにはテストランナーまで含まれたJS/TSのオールインワン開発環境と言っていいでしょう。

ランタイムとしての特徴

  • とにかく速い(JavaScriptCoreの拡張)
  • Node.jsとの互換性を目指してfspathなどAPI群の代替も実装されている
  • Web標準APIも実装されている
  • パッケージマネージャー、テストランナー、バンドラーも装備
  • TypeScript標準サポート
  • JSXがそのままで動く
  • デフォルトで--watchがある(嬉しい)

BunはNode.jsの代替として、「パフォーマンス向上」「シンプルさ」を目指したランタイムです。
JavaScript/TypeScript開発に必要な工程を管理するものがほとんど入っているため、Bunを入れておけば事足りるプロジェクトも多くなることでしょう。

インストール方法

まずはさっくりインストールしてみましょう。
macOS、Linuxで以下のコマンドを叩きます。

curl -fsSL https://bun.sh/install | bash

確認してみます。

$ bun -v
1.1.1

Windowsでは以下のコマンドです。(Windows10、バージョン1809以上)

powershell -c "irm bun.sh/install.ps1|iex"

アップグレードとアンインストール

ついでにアップグレードとアンインストール方法も紹介します。

アップグレード方法

bun upgrade

アンインストール方法(macOS / Linux)

rm -rf ~/.bun

アンインストール方法(Windows)

powershell -c ~\.bun\uninstall.ps1

Bunの実用性を確認してみる

実際にBunを使っていきます。
まずはBunの初期化を行います。

bun init

このコマンドを実行すると以下のファイルが作成されます。

.
├── README.md
├── bun.lockb
├── index.ts
├── node_modules
├── package.json
└── tsconfig.json

APIを試す

簡単にHTTPサーバーを立ててみます。

const server = Bun.serve({
  port: 3000,
  hostname: 'localhost',
  fetch(req) {
    const url = new URL(req.url)
    if (url.pathname === '/hello') {
      return new Response('Hello World')
    }

    return new Response('Not Found', { status: 404 })
  }
})

console.log(`Server running at http://${server.hostname}:${server.port}`)

これでhttp://localhost:3000/helloを開くと"Hello World"と表示され、その他のルーティングでは"Not Found"と表示されます。

Node.jsと比べてみるためにNode.js v20.10.0でシンプルなHTTPサーバーを立ててcurlしてみましたが、最小限で実行するとNode.jsのほうが高速な結果となりました。

# Node.jsの場合
./speed http://localhost:8000
time: 0.000956sec / download bytes per sec: 12552

# Bunの場合
time: 0.001154sec / download bytes per sec: 7798

Node.jsも19.7.0からC++製のAdaの採用によって高速化されているため、スピード対決でまさかのNode.jsの勝利。
Bunの公式ドキュメントではNode.js v16との比較が掲載されていたため、少しズルいなぁという感想です。

パッケージ管理を試す

npmやyarnなどと同じようにbunaddでパッケージインストールが可能です。

$ bun add next
bun add v1.1.1 (ca1dbb4e)

 installed next@14.1.4 with binaries:
  - next

 1 package installed [97.00ms]

こちらもnpmで比較してみます。

$ time npm install next

added 20 packages, and audited 22 packages in 2s

3 packages are looking for funding
  run `npm fund` for details

found 0 vulnerabilities
npm install next  2.22s user 1.14s system 172% cpu 1.952 total

97msと2.22sでBunのほうが速い結果が出ました。余談ですが、bun installだと3.9sだったため、Bunでパッケージ管理する場合はbun addを使いましょう。

バンドラーを試す

Bunに内包されているバンドラーを使ってビルドしてみます。

bun build index.ts --outdir=./out

これを実行するとout/index.jsが以下のように生成されます。

// index.ts
var server = Bun.serve({
  port: 3000,
  hostname: "localhost",
  fetch(req) {
    return new Response("Hello Bun", { status: 200 });
  }
});
console.log(`Server running at http://${server.hostname}:${server.port}`);

この例では少々わかりづらいですが、HTTPリクエストを減らし、TS等のモダンなJS代替をプレーンJSへ書き換えてくれます。
minifyやwatchオプションもあるため、一般的なビルドオプションはカバーしているものの、まだベータ版であるとのことです。

発展途上だがイマドキな実行環境

機能的にはかなり網羅されており、これからもまだまだ伸びそうな印象ですが、速度の部分で比較対象がNode.js v16であったことが残念でした。
ただ、v1.1であることを考慮するとかなり高速な部類であることは間違いありません。さらにJS/TS環境のオールインワンなランタイムとして環境を提供してくれるのは非常にありがたいです。

まだプロダクションレベルの案件には使いづらい部分もありますが、これからの成長に注目していきたいツールであると言えます。

関連するコンテンツ