리덕스(Redux)를 왜 쓰고 있을까?
: 본래 React를 쓰면서 'state 끌어올리기'에 부담을 느끼거나, 불필요한 props drilling 등이 이슈가 되면서 전역적인 state 관리법이 필요해졌고, 그에 대한 해답(?)으로 나온 것이 Redux라고 할 수 있다(React + Flux 패턴). 하지만 요즘은 전역적인 state 관리를 꼭 redux로만 할 수 있는 것이 아니다. context와 useContext 등의 조합 혹은 recoil, zustand, jotai 등의 신흥 state 관리 라이브러리 등이 이미 많고, 충분히 효용성을 입증한 상태이다. 이런 상황에 우리는 Redux를 왜 계속 쓰고 있을까?
리덕스(Redux)의 단점
: 왜 쓰고 있는지에 관련한 장점을 살펴보기 전에 리덕스의 단점에 대해서 먼저 정리해보면,
- 리덕스 스토어 환경 설정이 복잡하다. 일례로 extension도 default로 세팅되는 것이 아니라 직접 해줘야한다.
- 리덕스를 유용하게 사용하려면 많은 패키지를 추가해야 한다.
- 리덕스는 보일러플레이트, 즉 어떤 일을 하기 위해 꼭 작성해야 하는 (상용구)코드를 너무 많이 요구한다. 항상 action types, action 생성함수, reducer 등등을 정의해주면서 여러 파일을 돌아다니던 개발 과정을 생각해보자..
리덕스(Redux)를 쓰는 이유
- 리덕스를 사용한 개발 스타일이 너무 마음에 들 때
: 모든 상태 업데이트를 액션으로 정의하고, 액션 정보에 기반하여 리듀서에서 상태를 업데이트하는 이 간단명료한 발상 덕분에, 상태를 더욱 쉽게 예측 가능하게 하여 유지보수 측면에 긍정적인 효과가 있다. 이게(흔히 말하는 Reducer + FLUX 패턴) 마음에 드는 사람들은 계속 리덕스를 사용하면 된다. - 미들웨어
: Redux-saga, Redux-thunk 와 같은 미들웨어를 통해 비동기 작업에 대한 좀 더 디테일하고, 편한 컨트롤을 할 수 있다. 예를 들어, redux-saga를 쓰는 이유를 생각해보면, 아래와 같은 부분에서 좀 더 편하고, 명확한 개발을 할 수 있게 해준다.
Redux-saga가 유용한 순간들
- 요청을 연달아서 여러번 하게 될 때 이전 요청은 무시하고, 가장 마지막의 요청만 처리하도록 하고 싶을 때(예를 들어, input에서 keyCode===”ender”로 뭔가를 해놨다고 했을 때 repeat() 를 안쓰고, 마지막 엔터에만 api요청을 하고 싶다 했을 때) : takeLatest를 통해 가능하다.
- 특정 조건이 만족됐을 때 이전에 시작한 요청을 취소하는 상황
- 특정 콜백함수를 원하는 액션이 디스패치 됐을 때 호출하도록 등록을 하는 상황
- 컴포넌트 밖에서 어떤 작업을 수행할 때
이외에도 API 요청과 관련하여 이전에는 API 요청을 위하여 리덕스와 미들웨어를 사용하는 것이 당연시 됐었다. 그러나, 이제는 SWR 과 react-query 같은 라이브러리가 있기 때문에 단순 API 요청을 위하여 미들웨어를 사용 할 필요는 없긴하다. 하지만 그럼에도 비동기 작업에 대한 플로우에 대하여 더 많은 컨트롤이 필요할 때(위에서 saga가 하는 일과 같이) 미들웨어는 여전히 유용하게 쓰이고, Redux에는 이러한 미들웨어가 있다.
- 서버사이드 렌더링
: API 요청 결과를 사용하여 서버사이드 렌더링을 할 때 유용하다. 이 과정에서 미들웨어가 정말 유용하게 사용된다(사실 2번과 유사한 맥락이다). 리덕스가 없어도 충분히 구현 할 수는 있긴 하지만 레퍼런스도 부족하고 번거로운 편!. 물론, NextJS를 쓰면 좀 더 편리한 것으로 알고 있지만 일단 nextJS는 논외!. 추가로 첫 문장에서 말했던 Recoil, Zustand 등의 state 관리 라이브러리는 아직 SSR을 제대로 지원하지 않기 때문에 Redux가 아직은 SSR 과 관련하여 좀 더 매력적인 선택지 일 수 있다.
-
테스팅이 용이하다
: 리덕스를 사용한 앱은 테스트를 하기가 비교적 쉽다고 한다. 하지만 이것은 내가 직접 경험한 것은 아니기에(들은 내용) 이정도에서 정리하고 후에 직접 해보고 따로 정리를 해보고자 한다. -
그냥 많이 사용 돼서
: 이걸 장점? 혹은 쓰는 이유라고 하기엔 좀 그렇지만, 이러한 이유로 redux를 쓰고 있는 개발팀 혹은 개발자가 많을거라고 생각한다. 많이 사용된다는 것은 그만큼 레퍼런스도 많고, 믿을만하기 때문일테니까. 물론 개발자로서 이런 자세가 정답이다라고는 할 수 없지만, 대부분의 회사 제품이 이미 Redux로 만들어져있기도 하고, 많은 개발팀이 Redux를 채택했기에 Redux를 쓸 이유가 있을지도...?
⇒ 결론적으로 Redux를 쓸 이유가 남았다면 비동기 작업에 대한 컨트롤을 위한 ‘미들웨어’를 쓰기 위해 리덕스가 권장되는 상황임.
그럼 다음 포스팅에서는 실제로 Redux와 쓸 수 있는 미들웨어가 어떤게 있고, 그걸 쓴다는 측면에서 얼마나 이점을 가져갈 수 있는지 등에 대해서 알아보자.
