1. React의 상태 관리
react의 useState를 이용하면 지역 상태 관리를 할 수 있습니다. 하위 컴포넌트에서 해당 state를 사용하기 위해서는 props를 통해 하위 컴포넌트로 전달하여 사용할 수 있고 하위 컴포넌트에 state는 상위 컴포넌트에서 사용할 수 없습니다.
만약 리액트 프로젝트의 크기가 커지고 수 천개의 컴포넌트가 존재한다면 복잡한 state 관계들을 정리하는 데 매우 힘들고 어려울 것입니다.
이때 사용하는 전역 상태 관리 도구가 Context API, Redux 등과 같은 도구들입니다.
2. Context API의 단점
-
context api에서 상태값을 변경하면, provider로 감싼 모든 자식 컴포넌트들이 리렌더링한다. 그래서 context api를 상태관리 도구로 사용하면 각 자식 컴포넌트들이 리렌더링 하지 않도록 방어할 필요가 있다. 결론적으로 context api는 상태관리 도구로 사용하면 props drilling을 회피한다는 장점보다 잃는 것이 더 많다.
-
따라서 context api를 통해서 상태를 관리한다기 보다 props drilling을 대신 한다는 점에서 사용한다는 것이 더 적절해 보인다.
3. Redux의 특징
- react, vue, vanila js 등 다양한 환경에서 사용할 수 있는 전역 상태 관리 도구이다.
- 상태를 저장하는 Store를 따로 가지고 있다.
- thunk, saga와 같은 미들웨어를 추가적으로 사용하여 구성할 수 있습니다.
- Redux devtool extension을 사용하면 상태에 대한 디버깅이 가능합니다.
4. Redux의 단점
리덕스는 일반적인 라이브러리나 프레임워크가 아닙니다. 리덕스만의 설계 철학과 함께, 철학을 쉽게 따를 수 있도록 각종 도구를 지원해주는 개발 도구입니다. 설계 철학을 따르는 건 그냥 라이브러리를 사용하는 것과는 완전히 다른 문제입니다. 개발자가 그 설계 철학에서 요구하는 대로 코딩의 방식을 바꾸어야 합니다. 실제로는 상태가 읽기 전용이 아니더라도 읽기 전용인 것처럽 취급해야 하며, 상태를 변경할 때(리듀서를 사용할 때) 부수 효과가 없도록 잘 만들어야만 합니다.
리덕스를 사용함으로 인해 강력한 장점을 얻는 것은 사실입니다. 그러나 리덕스의 철학에서 강제하는 방식으로 인하여 오히려 코드가 복잡해지거나 코딩하기 어려워질 수도 있습니다. 만약 앞서 언급한 Redux의 장점 중 일부만이 필요하다면 Redux 대신 다른 것을 찾아보시기 바랍니다. 다른 것 다 필요 없고 상태 관리를 중앙화하는 것만 있어도 된다면 Context를 사용하세요
참고 자료
https://egg-programmer.tistory.com/281
https://dev.rase.blog/21-10-07-context-and-state-management/
https://slog.website/post/13
https://www.bangseongbeom.com/redux-benefits-caveats.html
