React-те батчинг туралы айтыңыз. Оны практикада қайда кездестірдіңіз?

В React батчинг — это процесс объединения нескольких обновлений состояния или пропсов в один рендер, чтобы повысить производительность и избежать лишних перерисовок.

Раньше React автоматически батчил обновления только внутри обработчиков событий. Начиная с React 18, батчинг стал работать и в асинхронных операциях, например, в промисах или setTimeout.

Пример батчинга:

function Component() {
  const [count, setCount] = React.useState(0);
  const [text, setText] = React.useState('');

  function handleClick() {
    setCount(c => c + 1);
    setText('обновлено');
    // React объединит эти два обновления в один рендер
  }

  return <button onClick={handleClick}>{count} - {text}</button>;
}

На практике сталкивался с батчингом при оптимизации производительности, когда нужно было избежать множественных рендеров при последовательных обновлениях состояния.