ハイサイ！オースティンやいびーん

概要

Bunのサーバーでリクエストからクエリパラメータをパースする方法を紹介します。

Bunとは

BunはNode.jsに代わるJavaScriptのランタイム環境として開発されています。要は、Node.jsと同じようにブラウザでない環境でJavaScriptが実行できるようにするプラットフォームです。大体、Node.jsと同じことをしています。

NodeがV8をベースにして作られたのに対して、BunはWebKitを元に設計されています。

BunとNodeの違い

まず念頭に言っておきたいのは、Bunは速いのです。以下の図でNext.jsのパフォーマンスを比較しているのですが、速いのがわかります。他のベンチマークでも軒並み速いんです。

引用：Bunホームページ

パフォーマンスの良さはZig言語で書かれた拡張のおかげらしいです。ZigはRust等のようにメモリ等を直接コントロールできるCの後継者言語のようですが筆者は詳しくありません。

それが一番の違いのですが、他にも以下のような利点があります。

ネイティブのESMサポート
ESBuildより速いバンドラーがネイティブ機能として使える
優れたパッケージマネージャー
ネイティブTypeScriptサポート
ネイティブ環境変数ファイル.envサポート
Web APIがブラウザと同様に実装されているのでブラウザで動くものはBunで問題なく動く

BunはNode.jsのパッケージのほとんどをそのまま使えるようになっている

BunはNodeにない機能をあれこれ用意してくれているのですが、すぐ取り入れたいと思う方、あっぱれです。

残念ながら、筆者は新しい技術を受け入れるコストを重く見てしまうので、Bunに関しては最初、慎重だったのです。新しい何かを勉強するということは、確実にそれがいいもので今後も残るであろうことが確実になってからやるべきだと考えています。

そして、Bunは今後も残りそうなので、一回は試すべきだと最近思いました。

Bunを試してみるとわかりますが、非常にNode.jsのユーザーに優しく設計されているので、学習コストが低いんです。

Nodeでできていたことのほとんどがそのままできるし、ブラウザ標準に乗っ取ってAPIが実装されているから、Nodeのように独特なAPIは少ないのです。

その例として、サーバーのRequestオブジェクトとクエリパラメーターの取得をこれから紹介しますが、とてもブラウザらしいJavaScriptで気持ちがいいです。

Bunをインストールする

Homebrewでインストールするのは簡単です。

brew tap oven-sh/bun # for macOS and Linux
brew install bun

他のインストール方法はHPでご確認ください。

Bunプロジェクトをセットアップ

プロジェクトのフォルダーを作ってそこに入りましょう。

mkdir Documents/practice/bun-quickstart
cd Documents/practice/bun-quickstart

そしてBun CLIを使ってpackage.json等の初期設定を行います。

bun init

プロンプトに従ってあれこれ設定できます。

`Bun.serve` で簡単なWebサーバーを実装する

Bunでサーバーを作るのはNodeと同様に簡単です。グローバルオブジェクトのBunをインポートする必要はなく、Bun.serveだけで実装できます。

index.ts


console.log("Hello via Bun!");

Bun.serve({
  port: 3000,
  async fetch(request, server) {
    return new Response('Hello World');
  },
});

ResponseはECMAScript標準のResponseオブジェクトそのもの、fetchから返ってくるResponseと一緒なのです。

クエリパラメーターをRequestから取得する

ここで、筆者はクエリパラメーターを取得したいなと思いましたが、requestにそれらしいプロパティはなく、困惑しました。そこで以下の事実を改めて実感しました。

Bunはあくまでも標準的なJavaScriptを実装しているのです。

そしたら、ブラウザでクエリパラメーターをどうやって取得するかというと、URLのAPIを使いますよね。Bunでもそのような考え方が通じるっぽいんです。

index.ts

Bun.serve({
  port: 3000,
  async fetch(request, server) {
    const { searchParams } = new URL(request.url);
    return new Response(searchParams.getAll('referrer'));
  },
});

これでsearchParams、つまりクエリパラメーターを取得することができます。

試してみる

試してみましょう。以下のコマンドを実行してサーバーを立ち上げます。

bun run index.ts

自動でTypeScriptをコンパイルしてくれるので、node-tsをインストールする必要はないです

http://localhost:3000/?referrer=google&referrer=bingでリクエストを送ってみましょう。

ホウホウ。うまくいきました。

まとめ

Bunを紹介して、Bunらしい考え方でクエリパラメーターを取得する方法も説明しましたが、いかがでしょうか？

筆者は、Bunが面白そうなので、今後もあれこれ遊んでみたいと思っています！