Когда выполняются эффекты при рендеринге в React

Эффекты в React выполняются после рендеринга компонента и его фиксации в DOM. Это происходит в следующем порядке:

1. Первый рендер → Эффект выполняется (useEffect без зависимостей)
2. Последующие рендеры → Эффект выполняется, если изменились зависимости (useEffect с массивом зависимостей)
3. Перед размонтированием → Срабатывает cleanup-функция (если она есть)

Пример:

useEffect(() => {
  console.log('Эффект выполнился после рендера');
  return () => console.log('Cleanup перед следующим эффектом или размонтированием');
}, [dependency]);

Важно: Эффекты не блокируют отрисовку UI, они выполняются асинхронно после обновления DOM. Для синхронных операций (например, измерение DOM) используйте useLayoutEffect.