React - useReducer의 dispatch와 useState 여러번 하는 것의 차이..

Question

useReducer 와 useState의 차이에 대해서 공부하고 있는데요..예를 들어 data fetching 을 성공적으로 마쳤을 때 isLoading 을 false로, isError을 false로 상태변환을 할 때useReducer의 reducer 안에서 아래와 같이 한번에 상태를 바꾸는 것과 useState() 두번 써서 상태를 바꾸는 것이 rendering 횟수가 다른 건가요? reducer를 쓰면 상태 바꾸는 것과 action을 취하는 곳을 분리해서 상태 변환하는 로직을 어느정도 묶을 수 있다는 장점이 있는 것은 이해 했는데, rendering 횟수까지 달라져서 좋아지는 것도 있는지 궁금합니다..case 'FETCH_SUCCESS': return { ...state, isLoading: false, isError: false, data: action.payload, };

페코옹 · Answer

말씀하신것처럼setState로 여러개의 state를 변경 시 각 state가 변경 될 때마다 렌더링이 발생해요reducer로 사용시 한 번만 렌더링이 발생하구요. 당연히 불필요한 렌더링이 줄어들면 성능상 좋은 부분이 있죠.그리고 reducer를 쓰면 로직을 컴포넌트에서 분리시킬 수 있어,상태 관리가 용이해지고 재사용성 증가 등 뭐 다양한 이점이 있지요. 참고로 최신 버전에서는 여러개의 state를 동시에 변경해도 배치 처리하도록 변경도있어요.

프론트직원 · Answer

친절한 답변 매우 감사드립니다!

React - useReducer의 dispatch와 useState 여러번 하는 것의 차이..

2개의 답변

Q&A 목록