> Что такое batching в React и зачем он нужен (React)

Batching в React - это механизм группировки нескольких обновлений состояния в одно повторное отображение (re-render) компонента. Без batching каждый вызов setState (или useState сеттера) вызывал бы отдельный рендер, что может привести к лишним перерисовкам и снижению производительности.

Зачем нужен batching:

1. Оптимизация производительности - уменьшает количество рендеров, объединяя изменения.

2. Предсказуемость - компонент обновляется один раз после обработки всех изменений, а не частично.

3. Согласованность данных - предотвращает промежуточные состояния, когда часть стейта уже обновлена, а часть - нет.

Пример:

JSX
function Counter() {
  const [count, setCount] = useState(0);
  const [flag, setFlag] = useState(false);

  function handleClick() {
    setCount(c => c + 1); // не вызывает рендер
    setFlag(f => !f);     // не вызывает рендер
    // React выполнит оба обновления за один рендер
  }

  return <button onClick={handleClick}>Click</button>;
}

Важно: До React 18 batching работал только внутри обработчиков событий React. В React 18 batching включен по умолчанию для всех обновлений (включая промисы, setTimeout, асинхронные колбэки). Если нужно принудительно обновить синхронно (например, для чтения DOM), используйте flushSync из react-dom.