RHFからTanStack Formへ乗り換えるべきか？

React Hook Form（以下RHF）を使っていると、最近「TanStack Form」という名前をよく見かけませんか？

TanStack QueryやTanStack Routerで有名なTanner Linsley氏が開発しているフォームライブラリで、2025年3月にv1.0がリリースされました。海外のRedditやGitHubでは「RHFから移行した」という報告もちらほら見かけます。

正直なところ、「今のプロジェクトでRHF使ってるけど、乗り換えたほうがいいの？」と迷っている人も多いと思います。今回は海外の議論を調べて、判断基準を整理してみました。

TanStack Form v1が安定版になった今、何が変わった？

TanStack Formは以前から存在していましたが、長らくベータ版でした。v1.0がリリースされたことで、ようやく「本番で使える」状態になったと言えます。

海外の記事によると、TanStack Formの主な特徴はこのあたりです。

  • TypeScript v5.4以上で厳格な型安全性を保証
  • フレームワーク非依存（React、Vue、Angular、Solid、Lit、Svelteに対応）
  • React 19の新しいフォーム機能との親和性

特に3つ目が気になりますよね。React 19でuseFormStatusやuseActionStateが追加されて、フォーム周りの扱いが変わりつつあります。TanStack Formはこの新しいAPIを前提に設計されているので、将来的な互換性では有利かもしれません。

数字で見る両者の違い

海外の記事でよく引用されている数字をまとめてみました。

バンドルサイズ

ライブラリMinifiedGzipped
TanStack Form v1.1136.4 KB9.6 KB
React Hook Form v7.5630.2 KB10.7 KB

意外なことに、gzipで比較するとTanStack Formのほうが若干小さいんですよね。日本の記事では「TanStack Formはサイズが大きい」と書かれていることが多いんですが、最新バージョンでは逆転しています。

GitHub Stats（2026年1月時点）

指標TanStack FormReact Hook Form
Stars~5,400~43,100
npm週間DL約11万約700万

採用実績ではRHFが圧倒的です。これは事実として受け止めておいたほうがいいですね。TanStack Formは「新しいもの好き」な層が試している段階で、本番環境での実績はまだ少ないです。

shadcn/uiも移行を検討している話

これ、日本ではあまり知られていないんですが、shadcn/uiのGitHubでTanStack Formへの移行が議論されています。

きっかけは2024年末にあるユーザーが立てたディスカッションです。主な論点は以下の通り。

  • TanStack Form v1が安定版になった
  • React 19およびReact Compilerとの互換性が優れている
  • Next.js/RSC（React Server Components）との親和性が高い

この議論に対して、Tanner Linsley氏本人が「Tailwind v4アップグレード後に開始予定」とコメントしています。つまり、shadcn/ui側も移行に前向きな姿勢を見せているわけです。

ただ、正式な採択決定は出ていません。複数の開発者が独自の実装版を公開して検証を進めている段階です。

こんなケースはTanStack Form、こんなケースはRHF

海外の記事を読んでいると、だいたい同じような結論に落ち着いています。

TanStack Formが向いているケース

✓ 複雑なネストされたフォーム
✓ マルチステップウィザード
✓ 複数フレームワークで共通のフォームロジックを使いたい
✓ TypeScriptの型安全性を最大限活かしたい
✓ React 19の新機能をフル活用したい

React Hook Formが向いているケース

✓ シンプルなログインフォーム、お問い合わせフォーム
✓ パフォーマンス最優先（uncontrolled inputsによる最小限の再レンダリング）
✓ 既存プロジェクトで安定性を重視したい
✓ ドキュメントやStack Overflowの情報量を重視

海外では「composable」というキーワードがトレンドになっていて、「状態管理とUIを疎結合させる設計」が推奨されています。この文脈だと、TanStack Formのほうが思想的に合っているんですよね。

逆に「とにかく動くものを早く作りたい」「情報が豊富なほうがいい」という場合は、RHFのほうが現実的な選択です。

移行時の注意点

海外のユーザーが報告しているハマりどころも紹介しておきます。

1. APIが全然違う

RHFのregisterに相当するものがTanStack Formにはありません。代わりにform.Fieldコンポーネントを使います。

// React Hook Form
<input {...register('username')} />

// TanStack Form
<form.Field name="username">
  {(field) => (
    <input
      value={field.state.value}
      onChange={(e) => field.handleChange(e.target.value)}
    />
  )}
</form.Field>

見ての通り、ボイラープレートは増えます。これを「型安全性のためのトレードオフ」と捉えるか、「冗長すぎる」と捉えるかは人によりますね。

2. 制御入力のみ対応

RHFはuncontrolled inputsを使うことで再レンダリングを最小化していました。TanStack Formは制御入力のみなので、パフォーマンスの考え方が変わります。

大規模なフォームだとこの違いが効いてくる可能性があります。

3. まだ情報が少ない

Stack OverflowやQiitaで「TanStack Form エラー」と検索しても、RHFほど情報が出てきません。ハマったときに自力で解決する覚悟は必要です。

まとめ

結論から言うと、「今すぐ移行する必要はない」というのが個人的な見解です。

TanStack Form v1が出たとはいえ、エコシステムの成熟度ではRHFに分があります。既存プロジェクトを無理に移行するメリットは薄いでしょう。

ただ、新規プロジェクトでReact 19をフル活用したい場合や、複雑なマルチステップフォームを設計する場合は、TanStack Formを検討する価値があります。shadcn/uiの動向を見ても、今後の主流になる可能性はありそうです。

まずは小さなプロジェクトで試してみて、自分の肌に合うかどうか確かめてみるのがいいと思います。