Что такое strict mode в React и зачем он нужен

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

Понимаете ли вы, что двойной вызов в разработке это диагностика, а не поломка. По ответу сразу видно, писал ли кандидат эффекты с очисткой и держит ли рендер чистым.

Как отвечать

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

Что он включает: повторный вызов всего, что обязано быть чистым, то есть тела компонента, инициализатора состояния, функции в useMemo и редьюсера, чтобы побочный эффект в рендере стал заметен; прогон эффекта при монтировании по циклу установка, очистка, установка, чтобы всплыли подписки и запросы без отмены; предупреждения об устаревших приёмах вроде строковых ссылок и старого контекста.

useEffect(() => {
  const ctrl = new AbortController();
  fetch(url, { signal: ctrl.signal }).then(setData);
  return () => ctrl.abort();  // без этого придут два ответа и победит случайный
}, [url]);

Подключается на корне дерева, во многих стартерах и во фреймворках на React включён по умолчанию. Инструментом производительности он не является: замеры в нём завышены, мерить нужно на продакшен-сборке.

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

Считают двойной рендер багом и отключают режим. Если от второго вызова что-то ломается, оно сломается и в продакшене, просто в другой момент и без возможности повторить.

Глушат повторный эффект флагом в useRef вместо того, чтобы написать очистку. Симптом уходит, а гонка ответов и висящая подписка остаются и выстрелят при быстрой смене параметров или размонтировании.

Путают со строковой директивой "use strict" из самого языка. Общего у них только слово в названии: одна меняет семантику JavaScript, другая включает дополнительные проверки React в разработке.