React에서 state변경 시, 왜 setState, useState를 사용하나요?

내용 정리

• 간단하게 말해서 상태 변수인 state를 직접 조작하게 되면 React가 상태 변화를 감지하지 못하고 리랜더링이 일어나지 않습니다. React는 VDOM을 통해서 랜더링을 처리하고 있는데, 이전의 VDOM과 새롭게 랜더링될 VDOM과의 비교를 통해서 랜더링을 진행하기 때문에 직접적으로 변경할 경우 state에 변화가 없다고 판단하기 때문입니다. state가 변경될 때마다 리랜더링을 할 경우 성능 저하의 이슈가 있기 때문에 setState를 통해 render 함수를 호출하고, 별도의 VDOM에 변경사항을 모아놨다가 실제 DOM으로 보내고 한번에 랜더링을 처리하는데(주기는 16ms), 그 과정에서 사용되는 것이 setState라고 볼 수 있습니다.

꼬리 질문

• setState Callback에 대해서 혹시 사용해보신 적 있나요?
• React의 불변성에 대해 아시는 게 있나요?

참고자료

• https://d2.naver.com/helloworld/2690975
• https://fathory.tistory.com/155