PassFront
  1. PassFront
  2. База знаний
  3. Продвинутые темы

Что такое batching?

Продвинутые темы

Batching (батчинг) — это группировка нескольких обновлений состояния в один перерендер, чтобы избежать лишних перерисовок. Термин чаще всего звучит в контексте React.

Проблема

Если каждое изменение состояния вызывает отдельный рендер, серия обновлений приведёт к множеству лишних перерисовок.

function handleClick() {
  setCount((c) => c + 1);
  setFlag(true);
  setName('Ann');
  // React объединит это в ОДИН перерендер, а не три
}

Как работает в React

React накапливает вызовы setState в рамках одного события и применяет их пакетом — компонент перерисовывается один раз с итоговым состоянием.

  • До React 18 батчинг работал только внутри обработчиков событий React.
  • С React 18 — автоматический батчинг везде: в промисах, setTimeout, нативных обработчиках («automatic batching»).

Отказ от батчинга

flushSync из react-dom заставляет применить обновление немедленно (нужно редко).

Более широкий смысл

Батчинг встречается и вне React: группировка DOM-изменений, сетевых запросов, операций записи для снижения накладных расходов.

Коротко для собеседования

Batching — объединение нескольких обновлений состояния в один перерендер ради производительности. В React 18 работает автоматически везде (события, промисы, таймеры). Немедленное применение — через flushSync.

Другие вопросы раздела