React Hook Form — Performant Forms with Easy Validation

What React Hook Form Does

• Uncontrolled inputs — refs instead of state, near-zero re-renders
• Validation — built-in rules + Zod/Yup/Joi resolvers
• Field arrays — dynamic add/remove fields
• Error handling — typed errors object
• Watch — subscribe to specific fields
• Form context — share form across components
• DevTools — browser extension to inspect forms

Architecture

register() returns props (onChange, onBlur, ref) you spread on inputs. The library tracks values via refs, not React state. handleSubmit validates and calls your callback with typed data. formState is a proxy that only re-renders subscribers.

Self-Hosting

Client library, no backend.

Key Features

• Smallest forms library (9KB)
• Zero dependencies
• Built-in validation + schema resolvers (Zod, Yup, Joi, Valibot)
• Watch API for reactive logic
• Field arrays for dynamic forms
• TypeScript-first
• DevTools extension
• Works with React Native

Comparison

FAQ

Q: How does it integrate with Zod? A: Use @hookform/resolvers/zod and pass resolver: zodResolver(schema). Form types are automatically inferred from the schema.

Q: What about controlled components? A: Wrap third-party UI (MUI, AntD, etc.) with the Controller component, which provides a controlled adapter.

Q: Is it SSR-friendly? A: Yes. All state lives in refs, so it doesn't affect hydration.

Sources & Credits

• Docs: https://react-hook-form.com
• GitHub: https://github.com/react-hook-form/react-hook-form
• License: MIT