효율적인 Query Key 관리: Query Key Factory의 활용
TanStack Query에서 데이터 패칭 및 캐싱을 위해
queryKey 설정이 필수적입니다. 하지만 프로젝트가 커질수록 다음과 같은 문제점이 발생할 수 있습니다:- Query Key 중복
- Query Key는 중복되면 안 되지만, 수동으로 작성할 경우 충돌이 발생할 수 있습니다.
- 오타와 유지보수의 어려움
- 동일한 Query Key를 반복적으로 작성하다 보면 오타가 발생하거나 관리가 어려워질 수 있습니다.
- 검색 및 재사용성 부족
- Query Key를 일일이 찾거나 중복된 키를 파악하는 데 시간이 소요됩니다.
어떻게 하면 효율적으로 관리하면서 이러한 문제들을 해결 할 수 있을까요? 좋은 방법 없을까요?
QueryKeyFactory
관련하여 공식문서도 읽어보고 검색도 해보니
Query Key Factory 라는 개념이 많이 언급되며 사용을 하고 있다는 것을 알게되었습니다. Query Key Factory는 Query Key를 하드코딩하지 않고, 체계적으로 생성 및 관리하기 위한 패턴이나 유틸리티입니다. 이를 통해 다음과 같은 장점을 얻을 수 있습니다:- 중복 제거: Query Key가 중앙에서 관리되어 중복 가능성이 낮아집니다.
- 타입 안정성: 잘못된 Query Key 사용을 방지합니다.
- 재사용 가능성: Query Key를 쉽게 생성하고 재사용할 수 있습니다.
- 유지보수 간소화: Query Key 변경 시, 한 곳에서 수정이 가능하여 일관성을 유지합니다.
직접 구현 방식
일반적으로
Query Key Factory는 2가지 방법 중 하나로 구현되며 feature 단위로 나누어 관리 및 사용하게 됩니다. 이러한 방식은 유지보수나 사용성에 매우 도움이 됩니다.객체 형태:
함수 형태:
또한 이러한 구조로 관리를 진행하게 되면
Query Key Factory 에 접근하는 방식을 통해 다음 작업들을 유연하게 진행 할 수 있습니다.라이브러리 활용: @lukemorales/query-key-factory 활용
해당 라이브러리를 사용하면 좀 더 관리를 간소화하고 번거로운 작업 없이 효율적으로
queryKey를 관리 할 수 있게 되며 다음과 같은 이점을 제공합니다- 일관성 유지: Query Key와 관련된
queryFn,staleTime등의 옵션을 한 곳에서 관리할 수 있습니다.
- 구조화된 접근법: 계층적으로 Query Key를 관리할 수 있습니다.
- 타입 안정성 제공: Query Key 작성 시 타입 지원을 통해 실수를 줄입니다.
설치 및 사용 방법
사용방법
한 파일내에 선언 및 관리:
createQueryKeyStore를 통해 중앙에서 queryKey를 정의 및 관리하게 됩니다.
- 객체 기반 접근 법으로 계층적 구조로 queryKey를 관리하고 싶은 경우 적합합니다.
기능 별로 나눠 파일을 분리하여 관리:
createQueryKeys 를 사용하여 각 기능별로 queryKey와 함수를 정의하고, mergeQueryKeys 를 통해 하나로 병합된 queries 객체를 만들어 다음과 같이 사용할 수 있습니다.- Query Key 정의
- Query key 병합
- 활용 예시
해당 라이브러리는
queryKey 뿐만 아니라 Query 자체에 전달할 요소들을 쉽게 관리 할 수 있게 해줘 query를 사용하는데 매우 편리함을 제공합니다. 이를 통해 커스텀 훅에 과도하게 의존하는 상황을 줄일 수 있게 되며 queryKey, queryFn, staleTime, queryOptions 등 값들을 함께 관리 함으로 코드 응집도를 향상 시켜주며 관련 로직 또한 직관적으로 표현 할 수 있게 해줍니다. 혹시 라이브러리에 대해서 좀 더 알아보고 싶다면 repository내 README 문서를 한 번 읽어보시면 좋을거 같습니다.
직접 구현 vs 라이브러리 사용
직접 구현을 선호하는 경우
- 유연성 필요: 프로젝트에 맞는 커스텀 로직을 구현하고 싶다면 직접 구현이 적합합니다.
- 외부 의존도 최소화: 라이브러리 사용을 지양하는 팀에서는 자체 구조를 정의하는 것이 더 나을 수 있습니다.
라이브러리 사용을 선호하는 경우
- 효율성 강조: 반복적인 작업을 줄이고 간결하게 Query Key를 관리하고 싶다면
@lukemorales/query-key-factory가 적합합니다.
- 팀 협업: 일관된 구조와 타입 지원을 통해 협업 과정에서 실수를 줄일 수 있습니다.
직접 구현 할 것인가? 아니면 라이브러리를 사용할 것인가? 각 장점과 단점이 있겠지만 결국은 프로젝트와 팀내 현재 상황과 선호도에 따라 결정되지 않을까 라는 생각이 듭니다.