React batching is an optimization technique that groups multiple state updates into a single render for better performance. It schedules an update and waits until more updates come to flush them all at once.
Fundamentally, in ReactJS, if you trigger a state update, it doesn’t immediately cause a re-render. Instead, React batches certain updates to the component’s state and props to minimize the number of rendering operations. This batching usually occurs within event handlers and lifecycle methods.
For example, if you have three state updates in one event handler, React will batch and apply them all at the same time, causing only one render, instead of three.
Batching in React is automatic. There is no need to do anything manually, but understanding how it works lets you write code that takes better advantage of React’s batching behavior.
However, it’s important to know that outside React event handlers, React can’t manage the batching process. For instance, promises and setTimeout fall outside React, so state updates will work synchronously, causing a new render for each one. To force batching in those circumstances, you can use ReactDOM.unstable\_batchedUpdates().
