Какая ключевая особенность в React render?
Рендеринг и производительность
Render в React означает чистое вычисление описания UI, а не рисование. Из этого следуют все остальные свойства рендера.
Render — вычисление, не эффект
Функция компонента (метод render) возвращает React-элементы — «что должно быть на экране». Она обязана быть чистой:
- те же props/state → тот же результат;
- никаких побочных действий в теле: запросов, подписок, мутаций, записи в DOM.
Почему это критично: React вправе вызывать рендер сколько угодно раз и когда угодно — дважды в StrictMode (проверка чистоты), повторно при конкурентном рендеринге (начатый рендер может быть отброшен ради срочного обновления). Побочные эффекты в теле выполнялись бы непредсказуемое число раз — их место в useEffect (после коммита).
Следствия
- Render ≠ обновление DOM: после вычисления идёт дифф; если отличий нет — DOM не тронут. Вызов функции компонента — дёшев по сравнению с DOM-операциями.
- Снимки состояния: каждый рендер замыкает свои props/state; setState не меняет переменные текущего рендера, а запрашивает следующий.
- Каскад по умолчанию: рендер компонента рендерит его детей (без сравнения props) — управляется React.memo и структурой состояния.
- Прерываемость: чистоту рендера React 18 конвертирует в возможность прерывать/возобновлять работу с приоритетами.
Коротко для собеседования
Главное: render — чистая функция «состояние → описание UI», без побочных эффектов; React может вызывать её многократно (StrictMode, конкурентность) и не обязан после неё менять DOM (дифф решает). Отсюда: эффекты только в useEffect, каждый рендер — снимок значений, каскад вниз, прерываемый рендеринг React 18.