Какие плюсы и минусы React Hook Form?
Хуки
React Hook Form (RHF) — библиотека форм, построенная на неуправляемых полях: значения живут в DOM и внутреннем сторе, а не в React-state.
Плюсы
- Производительность: ввод не вызывает ререндеров формы — поля регистрируются через ref, подписки точечные (
watch,formState.errors). На формах в десятки полей разница с Formik драматична. - Мало кода:
{...register('email')}вместо value/onChange и связки состояний. - Валидация: встроенные правила (required, pattern) плюс resolver'ы для схем — Zod, Yup, Valibot; типы формы выводятся из схемы.
- Гибкий контроль: режимы валидации (onChange/onBlur/onSubmit), dirty/touched-состояния, массивы полей (useFieldArray), вложенные структуры.
- Маленький размер, ноль зависимостей, отличная TS-поддержка; активно развивается.
Минусы
- Ментальная модель непривычна: неуправляемые поля, ref-регистрация, значения «не в state» — сложнее отлаживать, чем прямой state.
- Управляемые UI-библиотеки требуют обёртки: MUI, Ant, react-select подключаются через
<Controller>— дополнительный код и потеря части выигрыша в рендерах. - watch — ловушка производительности: подписка на всю форму возвращает ререндеры обратно; нужно подписываться точечно (useWatch на поле).
- Динамические/сильно зависимые поля и сложные кросс-полевые правила требуют аккуратности (useFieldArray, resolver со схемой).
- Тестирование неуправляемых полей чуть менее очевидно.
Когда выбирать
Большие и средние формы, схемная валидация, важна отзывчивость. Для формы из двух полей достаточно useState; для сильно динамического UI, где значение нужно всюду, управляемый подход может быть проще.
Коротко для собеседования
Плюсы RHF: нет ререндеров при вводе (ref-регистрация, точечные подписки), минимум кода, resolver'ы для Zod/Yup, отличная типизация, малый вес. Минусы: непривычная неуправляемая модель, Controller для управляемых UI-китов, watch на всю форму возвращает рендеры, сложные динамические формы требуют аккуратности.