Oxfmt - Prettierの30倍速いJavaScript/TypeScriptフォーマッター

はじめに

コードフォーマッターといえばPrettierが定番ですが、正直なところプロジェクトが大きくなるとフォーマットの待ち時間が気になってくるんですよね。特にpre-commitフックでPrettierを走らせていると、コミットするたびに数秒待たされるのがストレスになってきます。

そんな中、最近注目を集めているのが「Oxfmt」というフォーマッターです。Rustで書かれていて、Prettierと互換性を保ちながら30倍以上高速という、ちょっと信じられないスペックを持っています。2025年12月にアルファ版がリリースされたばかりですが、すでにGitHubで17,000以上のスターを獲得していて、個人的にはかなり期待しているツールですね。

Oxfmtの特徴・メリット

圧倒的なパフォーマンス

Oxfmtの最大の特徴は、その速度です。公式によると以下のパフォーマンスを実現しているとのこと。

• Prettierと比較して30倍以上高速
• Biomeと比較しても3倍以上高速

これ、実際に使ってみると体感できるレベルで違います。大規模なプロジェクトでも一瞬でフォーマットが完了するので、開発体験が明らかに良くなりますね。

Prettier互換で移行が簡単

新しいツールを導入するときに面倒なのが設定の移行ですが、OxfmtはPrettierの設定形式に対応しています。極端な話、.prettierrc.jsonを.oxfmtrc.jsoncにリネームするだけで移行できるんですよね。

現時点でPrettierのJavaScript/TypeScriptテストの約95%に合格しているので、ほとんどのケースで同じ出力が得られます。

主要な設定オプションをサポート

普段使う設定オプションは一通り対応しています。

• printWidth - 1行の最大文字数（デフォルト: 100）
• tabWidth - インデント幅
• useTabs - タブ使用の有無
• semi - セミコロンの有無
• singleQuote - シングルクォートの使用
• trailingComma - 末尾カンマの設定
• bracketSpacing - オブジェクトリテラルの括弧内スペース

ちなみにprintWidthのデフォルトが100になっているのは、TypeScriptのコードやimport文が長くなりがちなことを考慮した結果だそうです。個人的には80だと短すぎると思っていたので、これは良い判断だと思います。

インストール方法

インストールは各パッケージマネージャーで簡単にできます。

# npm
npm add -D oxfmt@latest

# pnpm
pnpm add -D oxfmt@latest

# yarn
yarn add -D oxfmt@latest

# bun
bun add -D oxfmt@latest

お試しで使いたい場合は、npxで直接実行することもできます。

npx oxfmt@latest

基本的な使い方

シンプルな実行

Oxfmtはデフォルトでprettier --write .と同じように動作します。カレントディレクトリ配下のファイルを再帰的にフォーマットしてくれます。

npx oxfmt

設定ファイルの作成

設定をカスタマイズしたい場合は、.oxfmtrc.jsonまたは.oxfmtrc.jsoncを作成します。JSONCだとコメントが書けるので個人的にはこちらがおすすめです。

// .oxfmtrc.jsonc
{
  "$schema": "https://oxc.rs/schemas/oxfmtrc.json",
  "printWidth": 100,
  "tabWidth": 2,
  "useTabs": false,
  "semi": true,
  "singleQuote": true,
  "trailingComma": "all",
  "bracketSpacing": true
}

$schemaを指定しておくと、VS Codeなどで補完が効くようになるので便利ですね。

Prettierからの移行

既存のPrettier設定から移行する場合は、設定ファイルをリネームするだけです。

mv .prettierrc.json .oxfmtrc.jsonc

package.jsonへのスクリプト追加

プロジェクトで使う場合は、package.jsonにスクリプトを追加しておくと便利です。

{
  "scripts": {
    "format": "oxfmt",
    "format:check": "oxfmt --check"
  }
}

実践的なユースケース

pre-commitフックでの活用

lint-stagedと組み合わせてpre-commitフックで使うケースが多いと思います。Prettierだとコミット時の待ち時間が気になっていましたが、Oxfmtならほぼ一瞬で完了するので、開発のリズムを崩さずに済みます。

// package.json
{
  "lint-staged": {
    "*.{js,jsx,ts,tsx}": ["oxfmt"]
  }
}

CIパイプラインでの利用

CIでフォーマットチェックを行う場合も、Oxfmtの速度は大きなメリットになります。

# GitHub Actions例
- name: Check formatting
  run: npx oxfmt --check

VS Code連携

VS Code拡張機能が公開されているので、保存時の自動フォーマットも設定できます。他のエディタでもoxfmt --lspでLanguage Serverを起動することで連携可能です。

現時点での制限事項

まだアルファ版なので、いくつか制限があります。

• 対応ファイル形式: JavaScript/TypeScriptのみ（JSON、CSS、HTMLなどは未対応）
• Prettierプラグイン: 未サポート
• package.json内の設定: 未対応
• .editorconfig: 未対応

ベータ版ではJSON対応やimport文の整理機能が追加される予定とのことなので、今後のアップデートに期待ですね。

まとめ

Oxfmtは、Prettierの使い勝手を維持しながら大幅な高速化を実現した、かなり筋の良いフォーマッターだと思います。特に以下のような方にはおすすめですね。

• 大規模プロジェクトでPrettierの速度に不満がある
• pre-commitフックの待ち時間を短縮したい
• Rustベースの高速ツールチェーンに興味がある

まだアルファ版なので本番環境での採用は慎重に検討すべきですが、個人プロジェクトや新規プロジェクトで試してみる価値は十分あると思います。Prettierからの移行も簡単なので、気になる方は一度試してみてはいかがでしょうか。