Какие основные подходы в написании кода в React?
Основы React
«Подходы в написании кода» на React — это набор принципов, которые отличают поддерживаемый код от каши.
Декларативность и чистота
UI описывается как функция состояния; тело компонента — чистое (без запросов, мутаций, подписок). Побочные эффекты — в useEffect, реакции на действия — в обработчиках.
Иммутабельность
Состояние обновляется новыми объектами (spread/map/filter/Immer). Мутации невидимы для React: ломаются рендеры, memo и зависимости хуков.
Композиция вместо наследования
Компоненты собираются из компонентов; расширение — через children/слоты и compound-компоненты, а не наследование классов.
Минимальное состояние и правильный уровень
- Не хранить производные данные (вычислять в рендере/useMemo).
- Состояние — как можно ближе к месту использования; вверх поднимать только по необходимости.
- Разделять типы состояния: локальный UI (useState) / общий клиентский (стор) / серверный кеш (React Query) / URL (роутер).
Однонаправленный поток данных
Данные вниз через props, события вверх через колбэки; источник правды единственный.
Переиспользование логики через хуки
Повторяющееся поведение — в кастомные хуки (useDebounce, useAuth), а не в HOC-обёртки.
Разделение ответственности
«Умные» компоненты (данные, логика) отделены от презентационных (props → разметка); UI-кит не знает о бизнес-логике.
Прагматичная оптимизация
Мемоизация — по результатам профилирования, а не по умолчанию; сначала структурные правки.
Коротко для собеседования
Декларативность и чистый рендер, иммутабельность состояния, композиция вместо наследования, минимальное состояние на правильном уровне (и разделение локального/глобального/серверного/URL), однонаправленный поток данных, переиспользование логики кастомными хуками, разделение умных и презентационных компонентов, оптимизация по профайлеру.