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