React узнаёт об изменении, сравнивая ссылки (Object.is). Мутация (items.push(x), user.name = ...) оставляет ссылку прежней — перерисовки не будет, а memo и useEffect не увидят изменений. Состояние обновляют новым объектом: spread, map, filter, toSorted.
А ещё Мутация ещё и ломает предыдущие значения, которые могли сохраниться в замыканиях
Так подсказку видит пользователь sotto на живом собеседовании — за пару секунд, пока вы думаете вслух.
Механика. setState(next) сравнивает next с текущим значением через Object.is. Совпали — React может пропустить рендер. Мутация меняет содержимое, но не ссылку.
Почему это хорошо, а не ограничение: сравнение ссылок — O(1), на нём построены React.memo, useMemo, зависимости эффектов. Неизменяемые данные дают историю (отмена действия), простую отладку и безопасность при параллельном рендеринге.
Глубокие структуры — копировать путь до изменённого поля или нормализовать данные (хранить сущности плоско по id).
sotto// плохо
items.push(newItem);
setItems(items); // та же ссылка — React пропустит
// хорошо
setItems(prev => [...prev, newItem]);
setItems(prev => prev.map(i => i.id === id ? { ...i, done: true } : i));
setUser(prev => ({ ...prev, address: { ...prev.address, city } }));sotto слышит вопрос интервьюера и показывает короткий ответ и план, как в блоке «Коротко». Оставьте контакт — пришлём доступ и промокод.