PassFront
  1. PassFront
  2. База знаний
  3. Хуки

В чем разница между Redux и useContext?

Хуки

Сравнение уровней: useContext — хук чтения контекста (транспорт), Redux — система управления состоянием. Общая у них только цель «данные без prop drilling».

useContext

Читает value ближайшего провайдера:

const { user } = useContext(AuthContext);

Состоянием не управляет — оно живёт в useState/useReducer у провайдера. Любое изменение value перерендеривает всех потребителей контекста: подписаться на кусочек нельзя.

Redux

Внешний стор + строгий поток: dispatch(action) → reducer → новое состояние → уведомление подписчиков:

const total = useSelector(selectCartTotal); // точечная подписка
const dispatch = useDispatch();

Перерендер — только у компонентов, чей выбранный селектором кусок изменился. Плюс Redux DevTools (история, time travel), middleware, устоявшиеся паттерны для больших команд.

Отличия

  • Подписки: все потребители против точечных селекторов.
  • Логика: произвольные сеттеры против централизованных редьюсеров (тестируемых отдельно).
  • Инфраструктура: ноль против стора, слайсов, провайдера, девтулзов.
  • Производительность на частых обновлениях: контекст будит всех; Redux — только заинтересованных.
  • Иронично: react-redux внутри использует контекст, но лишь для доставки инстанса стора.

Когда что

  • useContext: тема, локаль, текущий пользователь, редкие обновления, малые приложения.
  • Redux (или Zustand как легковесная альтернатива): сложное часто меняющееся состояние, много потребителей, нужна отладка и предсказуемость.
  • Серверные данные — React Query, не то и не другое.

Коротко для собеседования

useContext — способ читать значение контекста: без селекторов, любое изменение рендерит всех потребителей, управления состоянием нет. Redux — стор с редьюсерами, точечными подписками и девтулзами. Контекст для редких «окружающих» данных, Redux/Zustand — для сложного динамичного состояния.

Другие вопросы раздела