Что такое React Context и как работает хук useContext

Что проверяют

Понимаете ли вы, что контекст решает проблему передачи, а не управления состоянием, и знаете ли про его поведение при перерисовке.

Как отвечать

Контекст передаёт значение вниз по дереву, минуя промежуточные компоненты. Он избавляет от передачи пропса через пять уровней, где он никому не нужен.

Механика:

const ThemeContext = createContext("light");
<ThemeContext.Provider value={theme}>...</ThemeContext.Provider>
const theme = useContext(ThemeContext);

useContext находит ближайший провайдер выше по дереву и возвращает его значение, подписывая компонент на изменения. Значение по умолчанию из createContext берётся только тогда, когда провайдера выше нет вовсе, и обычно это признак ошибки, а не рабочий сценарий. В React 19 сам объект контекста можно использовать как провайдер напрямую, без .Provider.

Ключевая особенность, ради которой вопрос и задают: при изменении значения перерисовываются все компоненты, которые его читают, независимо от React.memo. Селекторов, как в Redux, здесь нет, подписаться на часть значения нельзя.

Отсюда практические правила:

• не передавать объектный литерал напрямую: value={{ user, setUser }} создаёт новый объект на каждом рендере провайдера, и все потребители перерисовываются всегда. Нужен useMemo;
• разделять контексты: часто меняющееся состояние и стабильные функции обновления держат в разных контекстах, тогда компоненты, которым нужен только dispatch, не перерисовываются вовсе;
• не превращать в хранилище: контекст это транспорт. Для серверных данных берут TanStack Query, для сложного клиентского состояния Redux Toolkit или Zustand.

Хорошая практика: заворачивать useContext в свой хук, который бросает понятную ошибку при отсутствии провайдера.

Где спотыкаются

Считают контекст заменой менеджеру состояния.

Передают объект без мемоизации и получают лавину перерисовок.

Кладут всё приложение в один контекст.

Полагаются на значение по умолчанию вместо явного провайдера.