react18의 새로운 기능 - 자동 배치
18버전 이전의 React에서는 이벤트 핸들러 함수에서 여러개의 상태 업데이트가 되어도 한번의 배치를 수행하여 단 한번만 리렌더링이 발생하였다.
하지만 promise, callback(), setTimeout(), native enent handler는 제외였다.
18버전에서는 React.createRoot를 사용해 제외되었던 부분도 포함하여 배치를 수행한다.
여기서 배치를 제외하고 싶을 경우, 적용하는 것이 flushSync 기능이다.
React.createRoot는 이전 버전의 index.js에서의 ReactDOM.render()를 대신하는 기능으로, ReactDOM.createRoot(rootNode).render()와 같이 작성하면 된다.
React Docs - flushSync
React 18 달라진 점
React 18의 새로운 기능
React 18에서 ReactDOM.render와 createRoot
