Capítulo 3 de 29

Chapter 3: Philosophy

Core Idea

TanStack Form deliberately favors one unified, somewhat steeper-to-learn API over several small easy-to-learn ones — betting that consistency pays off as forms grow in complexity.

Frameworks Introduced

  • Unified APIs over fragmentation: rather than exposing multiple parallel ways to validate or read a field, the library consolidates the tradeoffs into one API surface, accepting a steeper initial learning curve in exchange for fewer "which way is right here?" decisions later.
  • Flexibility-first validation: because real forms validate wildly differently, timing (change/blur/submit/mount), scope (field/form), and sync-vs-async are all independently configurable rather than baked into one opinionated pipeline.
  • Controlled components by design: every input is controlled, which the library treats as a feature — predictable state, easy testing, renderer independence (works the same in React Native or non-DOM renderers), and straightforward conditional rendering.
  • Type inference over generics: "you should never need to pass a generic" — types are inferred from your actual defaultValues, so TypeScript and JavaScript usage look nearly identical.
  • Built for composition: the library expects to be wrapped in your own design system (createFormHook, ch020), not used raw in every component.

Mental Models

  • When choosing between "simple API, many small APIs" and "one API, more upfront learning," TanStack Form always picks the second. Anticipate a real onboarding cost, but fewer "which of these three ways do I use" decisions six months in.
  • Controlled-only is not a limitation to work around — it's the reason the library works identically in React Native, canvas-based renderers, etc. Fighting it (e.g. trying to make an input uncontrolled) works against the design.

Anti-patterns

  • Reaching for a second validation mechanism because the built-in one feels unfamiliar: the flexibility (ch008 Form Validation) already covers nearly every timing/scope combination — check there before layering react-hook-form-style patterns on top.

Key Takeaways

  1. Expect the API to feel more uniform, not more minimal, than React Hook Form or Formik — that uniformity is the design goal, not an accident.
  2. Never write field-name generics by hand; if you find yourself doing that, something is off (see ch005 TypeScript, ch028 for DeepKeys).
  3. Plan from the start to wrap the raw hooks in your own createFormHook-based components (ch020) rather than calling useForm/form.Field directly everywhere.

Connects To

  • Ch001 Overview: the architecture these principles produce.
  • Ch020 Form Composition: createFormHook, the concrete expression of "built for composition."
  • Ch004 Comparison: how these choices differ from React Hook Form/Formik/Final Form.