useState는 비동기일까 동기일까? ( 배치 )

정답 먼저 얘기하자면 useState는 비동기 적으로 동작한다

 

왜 비동기적으로 동작하냐면 렌더링 문제와 관련이 있다고 할 수 있는데

리액트에서는 상태가 변경될때 마다 리렌더링을 한다는 것을 알고 있을 것이다

그럼 setState가 연속으로 호출되면 어떨까?

// ex
const manySetState = () => {
	setState(...);
    setState(...);
    setState(...);
    setState(...);
    ...
}

고작 함수 한번에 엄청나게 많은 리렌더링이 발생할 것이다

당연하겠지만 이건 문제가 있다

 

그래서 리액트에서는 배치(batch)라는 것을 사용한다

batch는 위에 언급한 문제를 해결한 방법인데

 

여러개의 setState를 하나의 리렌더링으로 묶어주는 방법이다

 

더 자세하게 얘기하면 16ms동안 변경된 상태 값들을 하나의 batch로 묶으며

함수 단위로 batch를 나눈다

즉, 함수가 3개면 batch도 3개다

 

 

 

리액트의 상태업데이트시 리렌더링을 공부하다 의문이 들어서 찾아봤었는데

이미 똑똑하신 분들은 다 정답을 만들어두셨다

18버전에서는 batch가 더 강화된 것으로 알고있는데 리서치가 끝나면 새로 포스팅할 예정이다

 

 

잘못된 정보이거나 부족한 부분이 있으면 누구든 피드백 주시면 감사드리겠습니다