ANDPAD フロントエンドエンジニアの小泉（ @ykoizumi0903 ）です。あけましておめでとうございます。
この年末年始に、 Vue / Vite の関連ツールの現状をまとめる記事（【2026年最新】Nuxt 4 アプリに入れておきたいオススメ設定集）を書いていたのですが、その中で1つの発見がありました。
それは、Oxfmt のステータスがかなり実用的なところまで進んでいるらしいということです。
Oxfmt は、Rust製の超高速な JavaScript ツールチェーン Oxc の一部として開発されているフォーマッターであり、Vue.js や Vite の生みの親である Evan You 氏が設立した新会社 VoidZero が開発を主導しています。
2025年11月に Alpha 版がお披露目された Oxfmt 、その後もアップデートが続いていたのですが、つい先日リリースされた oxlint v1.39.0 & oxfmt v0.24.0 によって、実際の開発に投入しても問題ない機能が揃ったと感じました。
なので、今こそ Oxfmt に乗り換えるべき理由と、実際に乗り換えてどのくらい実行速度が改善したかというデータをご紹介していきたいと思います。
Oxfmt に乗り換えるべき理由
とにかく速い
Oxfmt を導入する最大のメリットは何と言っても実行速度です。
公式ベンチマークによると、Oxfmt の実行速度は Prettier の 35 倍、 Biome の 3 倍と宣伝されています。
実際のアプリケーションに導入してみた計測結果は後述しますが、少なくとも Prettier からの移行では間違いなく大幅な高速化が見込めるでしょう。
Prettier からの移行が簡単
Prettier との互換性を強く意識しており、Prettier からの移行パスが提供されているのも特長です。
Migrate from Prettier という移行ガイドが公式に用意されており、迷いなく移行作業を進められます。
しかも、CLI で --migrate=prettier コマンドが用意されており、既存の .prettierrc から設定を自動で引き継いで .oxfmtrc.json を自動生成してくれます。
現時点では Prettier のプラグインエコシステム自体はサポートされていないものの、一部のプラグインの機能は、Oxfmt では実験的機能として標準でサポートされています。
具体的には、import 文のソート、package.json のソート、Tailwind Class のソートが既に実装済みで、 Prettier でこれらのプラグインしか使っていない場合は既に移行可能となっています。
non-js ファイルもフォーマットできる
Oxc は JavaScript 向けツールチェーンなので、 Oxfmt で直接フォーマットできるのは JS / TS ファイルだけです。
しかし、それ以外の non-js ファイルに対しても、内部 API で Prettier を呼び出すことでフォーマットできるようになっており、Vue ファイル内の CSS や JS ブロックのフォーマットもサポートされています。
Prettier と完全に互換を保ったまま全てのファイルのフォーマットができるので、Prettier から乗り換えるためのハードルが非常に低く、既存プロジェクトに導入しやすくなっています。
もちろん、non-js ファイルのフォーマットの速度はそこまで大きく変わりませんが、開発のメインである JS / TS のフォーマットが爆速になるだけで、全体の待ち時間は大幅に削減されることでしょう。
VSCode 拡張機能がリリース済み
Oxc は既に VSCode （およびそのフォークエディター）で利用できる拡張機能を提供しています。この拡張機能は Oxlint と Oxfmt で共通です。
実は少し前まで、 Oxc の VSCode 拡張機能では JS / TS 以外のファイルへのフォーマットが動作しないという課題があり、個人的にここが Prettier から Oxfmt に乗り換える上で最大のネックでした。
しかし、2026年1月12日のアップデートにより、ついに VSCode 拡張機能（Oxc）で non-js ファイルが公式にサポートされました。保存時にファイルを自動フォーマットする formatOnSave にももちろん対応しています。
これにより、VSCode での自動フォーマットに慣れている場合でも、違和感なく移行できるようになりました。
実際の導入手順
このリリースを受けて、さっそく自分が現在開発を担当しているリポジトリでも導入してみました。
といっても、公式の移行ガイドを見れば迷うことはほとんどありません。
npm add -D oxfmt@latest && npx oxfmt --migrate=prettier && npx oxfmt
基本的にはこれだけで自動的に .oxfmtrc.json が作成されて設定が引き継がれます。
なお、 Oxfmt のフォーマットは Prettier 3.7 に準拠しており、それ以前のバージョンからはフォーマット形式が少し変わっています。気になる場合は先に Prettier 3.7 に上げてフォーマットしてから移行する方が安全です。
あとは Oxc 拡張機能をインストールし、VSCode の editor.defaultFormatter を変更すれば完了です！
注意点
個人的にハマったポイントとして、 /usr/bin/env: ‘node’: No such file or directory というエラーが出て Oxc の拡張機能が動かないという問題に遭遇することがありました。
これは、VSCode 拡張の Oxc を動作させる際は、システム（Global）に Node.js がインストールされ、パスが通っている必要があるためです。
Homebrew であれば brew install node、mise であれば mise use node --global などを使って、グローバルで node が実行できる状態にしておく必要があります。
もし上記のエラーに遭遇したら、まずはターミナルのルートディレクトリで node -v が実行できるか確認してみてください。
パフォーマンス測定結果
実際に運用中のリポジトリで、 Oxfmt のパフォーマンスを測定してみました。厳密に複数回平均を取ったりしたわけではないので、参考程度に見てください。
まず、 oxfmt と元々実行していた prettier --write 、そして Prettier 3.6 で導入された実験的な高速化フラグを ON にした prettier --experimental-cli という 3 つのコマンドで実行してみます。
| 実行コマンド | 実行時間 | 比較 |
|---|---|---|
time bunx prettier --write |
40.451s | |
time bunx prettier --write --experimental-cli |
20.036s | 2.0x |
time bunx oxfmt |
11.960s | 3.4x |
30秒以上の大幅な時間短縮になりました。 --experimental-cli の改善効果も大きいですが、そこからさらに2倍近い効果を得られています。これだけの改善があれば、CI でチェックする際のコストや待ち時間に対しても目に見える効果がありそうです。
とはいえ、35倍という公称のベンチマークとは開きがあります。が、ここで思い出してほしいのは、 Oxfmt も JS / TS ファイル以外は Prettier 経由でフォーマットしているということです。
このリポジトリには .vue や .json などのファイルがありますので、それを除いた時間を改めて計測してみます。
| 実行コマンド | 実行時間 | 比較 |
|---|---|---|
time bunx prettier --write "app/**/*.{js,ts}" |
13.280s | |
time bunx prettier --write app/**/*.{js,ts}--experimental-cli --cache=false |
1.368s | 9.7x |
time bunx oxfmt app/\**/\*.{js,ts} |
0.276s | 48.1x |
見ての通り、元の Prettier から 48 倍という圧倒的な速度改善となりました！ --experimental-cli 比で30倍はさすがに届きませんでしたが、環境によってはそのくらいの効果が出てもおかしくないと感じるほどの劇的な改善です。
これだけの恩恵を受けながら、 Prettier から簡単に移行できるので、すぐにでも採用を検討する価値があるのではないでしょうか。
まとめ
Oxfmt はリリースから時間が経っておらず、現状は Alpha 版の段階ですが、短期間でどんどん改善が進んでおり、既に実用可能になっている印象です。
プラグインエコシステムの複雑性が高く、Vue プロジェクトではまだ切り替えが難しい ESLint から Oxlint への移行と違い、 Prettier から Oxfmt へは完全に切り替えても問題ない状態になったと言えるのではないでしょうか。
もちろん安定版ではないので自己責任にはなりますが、コードフォーマッターなので他のツールと比べても本番動作に影響を与える可能性が低く、 Prettier と比較して足りない機能もほとんどありません。一度手元でフォーマットしてみて、問題がありそうなら戻すのも簡単です。
この記事で興味を持った方は、ぜひ気軽に Oxfmt への移行にトライしてみてください！
おわりに
アンドパッドでは一緒に働く仲間を募集しています。
アンドパッドでのフロントエンド開発に興味を持った方は、ぜひカジュアル面談などお気軽にご応募ください！
