전역 redux 값 사용 관련 질문 있습니다.

Question

안녕하세요! 리덕스를 쓰는 이유에 대해서 궁금한 점이 생겨서 질문드립니다.
작은 프로젝트에서는 정보를 저장하는 데 hooks과 props를 사용해도 문제가 없는 것 같은데
리덕스 스토어에 모든 값을 전역값으로 저장하면 프로젝트가 무거워지는 것 같습니다.
axios통신, 데이터 저장과 상태관리에 리덕스를 사용하면 좋은 점이 뭐가 있을까요?
props drilling을 막고, 버튼 같은 하위 컴포넌트에서 바로 사용할 수 있는 장점이 있다고 알고 있습니다.

김재성 · Accepted Answer

사실 api 캐싱 레이어로 예전에 리덕스를 많이 사용해왔는데, 간단한 api 캐시 구현임에도 불구하고 기반 코드(boilerplate)가 많이 필요해서(물론 redux toolkit 등 이걸 리덕스 내에서 해결하려는 접근도 많지만 여전히 복잡하다고 생각합니다) 요즘은 잘 사용하지 않는 추세입니다. 리액트 쿼리(https://tanstack.com/query/latest, 리액트 이외에도 지원하고 싶어서인지 tanstack query로 이름을 바꿨더군요)라는 라이브러리가 이 문제를 잘 해결했다고 생각해서 사용해보시면 좋겠습니다. next.js 를 만든 vercel 의 SWR(https://swr.vercel.app/ko)도 같은 접근 방식인데, 리액트 쿼리 쪽이 더 기능이 풍부합니다.

프로젝트가 무거워진다는 건 런타임에서의 메모리 사용량을 말씀하시는 걸까요? 리덕스의 경우는 https://redux.js.org/faq/performance#will-having-one-state-tree-cause-memory-problems-will-dispatching-many-actions-take-up-memory 에 설명하고 있기는 한데 기본적인 자바스크립트의 가비지 컬렉션에 의지할 뿐 사용되지 않는 상태에 대한 가비지 컬렉션은 기본적으로 제공하지 않는 것으로 보입니다. 리액트 쿼리의 경우에는 훅의 호출이 일정 시간 동안 이루어지지 않으면 해당 키의 캐시값을 비우는 가비지 컬렉션 로직이 있습니다. 자세한 건 문서를 참고해주세요. https://tanstack.com/query/v4/docs/react/guides/caching