[React] Automatic Batching

What is batching?
Batching is when React groups multiple state updates into a single re-render for better performance.
출처: https://github.com/reactwg/react-18/discussions/21

 

Automatic Batching 리액트18에서부터 추가된 기능이다. 하나의 이벤트 내에 여러개의 상태 변화가 있을 경우, 이들을 모아 한 번의 렌더링으로 처리한다. 이로 인해 불필요한 렌더링을 줄일 수 있다.

 

하나의 이벤트 안에 같은 상태 변화를 여러번 진행하게 되면, 내부에서는 코드가 순서대로 돌아가더라도 한 번의 렌더링으로 마지막 변화밖에 보여주지 않기 때문에, 하나의 이벤트 안에서 상태변화를 통해 무언가를 연속해서 보여줘야 한다면 setTimeout 등을 통해 약간의 딜레이를 주는게 좋다.