Farm は Rust 製の次世代 Web ビルドツールです。2024 年 4 月に v1.0 がリリースされました。
最近特に注目を集めており、2024 年 6 月末の時点で 3.3k ものスターが付いています。
本投稿では、Farm の特徴をまとめるとともに、公式の Quick Start で実際に触ってみます。
ビルドツールとは
Web フロントエンドにおけるビルドツールとは、ソースコードを最終的に配信される形式に変換するソフトウェアを指します。ビルドツールの役割として以下ものが挙げられます。
- トランスパイル
- モジュールバンドル (ファイルの結合)
- minification (不要なスペース、コメントを除去するなどして、ファイルサイズを小さくする)
また、ホットリロード付きの開発サーバー機能が付属することもあります。
代表的なビルドツール:
Farm の特徴
Farm は Vite や webpack のような既存ツールと同等の機能を持ちつつ、より高速であることを売りにしています。
下の図は開発ビルドにかかる時間の比較です (hotStartup はキャッシュありの場合)。Vite と比べても非常に高速なことが分かります。
https://www.farmfe.org/docs/benchmark
Vite も高速なビルドツールとして登場しましたが、開発環境ではネイティブ ESM を使用するため、大量のモジュールを読み込む場合にはブラウザが処理しきれなくなる問題があります。(私はそんな経験はないですが…)
また、Vite は開発環境での事前バンドルに esbuild、本番環境用のバンドルに Rollup を使用するため、一貫性が欠け、デバッグが困難になるという問題があります。
Vite の後者の問題は、Rolldown という新しいバンドラへの置き換えで解消される見込みです。
Vite – なぜ esbuild でバンドルしないのか？
Farm には以下の思想で開発されています。
- パフォーマンス重視
- 大部分が Rust で書かれています。
- 一貫性重視
- 開発環境と本番環境の動作が一貫するように設計されています。
- 部分バンドル
- すべてをまとめるのではなく、20-30 程度に分割してバンドルします。
- これにより、キャッシュ効率を維持しつつ、読み込みパフォーマンスを向上させます。
- 互換性
- 最新のブラウザだけでなく、古い ES5 でも動作します。
- プラグイン
- 既存の rollup/vite プラグインを利用可能です。
- JS だけでなく、Rust でプラグインを書くこともできます。
Quick Start
Node 20.10.0 で試します。
プロジェクト名とフレームワークを選択して、プロジェクトを作成します。
指示通りサーバーを起動します。ページが表示されました。
npm run build でビルドします。
dist/ を見ると、CSS, JS ファイルともに複数のファイルに分割されています。
dist
├── favicon.ico
├── index.html
├── index_465f.40296e4e.css
├── index_465f.40296e4e.css.map
├── index_7d50.6a5a4f3f.js
├── index_ab3e.5bec1339.js
├── index_d466.444f7e3c.js
├── index_d466.444f7e3c.js.map
├── index_e0f1.feea8c06.js
├── logo.e052fe17-7e9d40.png
└── react.35ef61ed-f49548.svg比較として、Vite のプロジェクトをビルドした際の dist/ は以下の通りです。
dist
├── assets
│ ├── index-DVoHNO1Y.js
│ ├── index-DiwrgTda.css
│ └── react-CHdo91hT.svg
├── index.html
└── vite.svg*.map は Source Map と呼ばれるもので、元のソースコードとの間のマッピング情報を提供するJSONファイルです。
まとめ
Farm は Vite 互換の Rust 製 Web ビルドツールです。
今後もキャッチアップしつつ、売りである速さを体感するために使い倒してみようと思います。