Есть ли в React аналоги useEffect?
Хуки
Да — у useEffect есть «родственники», отличающиеся моментом выполнения: useLayoutEffect и useInsertionEffect; плюс альтернативные способы решать те же задачи без эффектов.
Прямые аналоги (семейство эффектов)
- useEffect — после коммита и отрисовки кадра; стандарт для запросов, подписок, работы с внешним миром.
- useLayoutEffect — синхронно после изменений DOM, до отрисовки: измерить layout и поправить без мигания (тултипы, скролл).
- useInsertionEffect — ещё раньше, до мутаций DOM; узкоспециальный, для CSS-in-JS библиотек (вставка стилей).
Порядок: insertion → layout → отрисовка → effect.
В классовых компонентах
Методы жизненного цикла: componentDidMount + componentDidUpdate + componentWillUnmount вместе покрывают то, что делает useEffect с разными deps и cleanup.
Не аналоги, но замены в конкретных задачах
Современный React часто позволяет обойтись без эффекта:
- данные с сервера — React Query/SWR или лоадеры маршрутов/серверные компоненты вместо fetch в useEffect;
- производные значения — вычисление в рендере или useMemo (не effect + setState);
- реакция на действия пользователя — обработчики событий;
- подписка на внешние сторы — useSyncExternalStore (корректнее ручного эффекта);
- «выполнить при изменении props» — часто пересмотр архитектуры (ключи, вычисления) вместо эффекта.
Документация React прямо называет ряд употреблений эффектов лишними («You Might Not Need an Effect»).
Коротко для собеседования
Аналоги по времени выполнения: useLayoutEffect (до отрисовки, для измерений DOM) и useInsertionEffect (для CSS-in-JS); в классах — тройка componentDidMount/DidUpdate/WillUnmount. Но для многих задач эффект не нужен вовсе: данные — React Query, производные — useMemo, сторы — useSyncExternalStore, действия — обработчики.