1 min readMay 4, 2020
I think it’s important to note that it is not always the case that setState
calls are batched. In the current version of React (16.13.1), setState
is currently only batched for
- Synthetic event handlers attached to React components.
useEffect
without asynchronous calls.ReactDOM.unstable_batchedUpdates
calls.
It will not be batched when
- Called inside asynchronous functions, like Promises, async/await functions,
setTimeout
,setInterval
,requestAnimationFrame
,requestIdleCallback
. - Event handlers for DOM event listeners (non-synthetic events, e.g. handlers passed to
addEventListener
). - Asynchronous callbacks (for example XHR).
However, this is an implementation detail in React and should not be relied upon in your code as the batching behavior may change in future versions of React.
You can check this CodeSandbox example for current and future reference.