pproenca avatar

React Hook Form

A solid collection of 41 performance rules organized by impact level, from critical form configuration choices like using onSubmit validation mode to smaller optimizations around field arrays and component integration. Most valuable for the subscription patterns, which are where React Hook Form performance actually lives or dies. The useWatch versus watch distinction alone saves countless re-renders. Categories are well thought out with clear prefixes for navigation. Covers the common pain points like shadcn Select wiring and Material-UI Controller patterns. Strictly client-side validation, so if you're doing React 19 Server Actions, this won't help. Best applied during initial form setup rather than as a debugging tool after things are already slow.

skills.sh installs
3.1K
GitHub stars
222
last updated
Aug 21, 2026

Install

$ npx -y skills add pproenca/dot-skills --skill react-hook-form --agent claude-code

Installs into .claude/skills of the current project.

Files

React Hook Form Best Practices by Community

Comprehensive performance optimization guide for React Hook Form applications. Contains 35 rules across 7 categories, each naming a decision that goes wrong by default. Verified against react-hook-form 7.82.0.

When to Apply

Reference these guidelines when:

  • Writing new forms with React Hook Form
  • Configuring useForm options (mode, defaultValues, validation)
  • Subscribing to form values with watch / useWatch / subscribe
  • Integrating controlled UI components (MUI, shadcn, Ant Design)
  • Managing dynamic field arrays with useFieldArray
  • Handling async submit, server errors, and submit lifecycle state
  • Reviewing forms for performance issues

When NOT to Use This Skill

  • React 19 Server Actions / useActionState — use the react-19 skill instead
  • Deeply nested, fully type-safe forms — TanStack Form may be a better fit for forms with complex nested schemas; this skill assumes you've already chosen RHF
  • Single-input or trivial forms — uncontrolled <form> + FormData is often simpler than pulling in any library

Rule Categories by Priority

Sponsors

Details

Repository
github.com/pproenca/dot-skills
Categories
Frontend Development, Backend & APIs, Debugging
First seen
May 16, 2026

More from pproenca/dot-skills

All 100
1nexu-io avatarshadcn-uinexu-io/open-designBuild UI components with shadcn/ui. Pairs with the Stitch design loop to ship structured, accessible components quickly.3Kskills.sh installs
20xbigboss avatarreact-best-practices0xbigboss/claude-codereact best practices3Kskills.sh installs
3sickn33 avatarui-ux-pro-maxsickn33/antigravity-awesome-skillsui ux pro max2.8Kskills.sh installs
4vercel-labs avatarreact-pdfvercel-labs/json-renderReact PDF renderer for json-render. Use when generating PDF documents from JSON specs, working with @json-render/react-pdf, or rendering specs to PDF buffers/st2.4Kskills.sh installs
5sergiodxa avatarfrontend-testing-best-practicessergiodxa/agent-skillsTesting best practices for the frontend. Emphasizes E2E tests over unit tests, minimal mocking, and testing behavior over implementation details. Use when writi2.2Kskills.sh installs
6getsentry avatarsentry-svelte-sdkgetsentry/sentry-for-aiFull Sentry SDK setup for Svelte and SvelteKit. Use when asked to "add Sentry to Svelte", "add Sentry to SvelteKit", "install @sentry/sveltekit", or configure e2.2Kskills.sh installs