8월에 읽은 것, 배운 것, 느낀 것

읽은 것

1. useEffect 잘못 쓰고 계신겁니다.

이미 잘 압축된 글이라 짧게 말하자면

리액트18의 strict mode에서는 렌더링을 두번씩 하는데 그럴 경우 불필요한 상태 변경/리렌더링이 있을 수 있으니 클린업함수를 꼭 넣어줘라, 연산이 비싸면 useMemo 써라, react-query 등 캐시된 데이터 써라

라는 내용이었다.

2. 리액트 전역 상태의 기준이 뭘까요? (프론트엔드 단톡방에서 나왔던 얘기를 정리했습니다.)

리액트 쿼리의 철학을 따른다면 서버 상태는 리액트 쿼리로 관리하고 클라이언트 상태는 해당 페이지/컴포넌트의 책임인지, 앱 전체의 책임인지에 따라 구분한다.
계정이나 설정 정보같이 서버와 주고받는 데이터, 화면과 무관한 데이터나 컴포넌트를 가로지르는 데이터(form 요소들)은 전역에서 관리하는 게 오히려 낫다.

최근 상태 관리의 움직임을 보면 예전보다 더 전역상태를 많이 지원하고 권한다. 컴포넌트 데이터 교환이 props로 인해 복잡해진다면 전역 상태로 관리해도 무방하다. 다만 기존에 전역 상태를 쓰지 말라고 한 것은 전역 상태를 컴포넌트들이 수정하기 시작하면 어디서 수정된 건지 관리가 힘들기 때문이다. 그래서 최근 상태관리들은 대부분 수정 추적을 할 수 있도록 설계되어있다. 마지막으로 페이지나 UI를 가로지르는 state는 큰 전역으로 해야 추적과 디버깅이 편하다.

결론

1. 단순 Ui관련 state는 웬만해선 전역으로 넣지않는다
2. 여러 Ui에서 공유하는 state는 전역으로 넣는다
3. View단에 절대 state를 선언하지 않는다