staleTime
- 데이터를 신선한 상태로 간주하는 시간
- 기본값 0
- 캐시된 데이터가 stale(구식) 상태가 되기 전까지의 시간을 밀리초 단위로 설정함
- 데이터가 신선한 상태라면, 재요청 없이 캐시 데이터를 반환함 (동일한 데이터)
- 데이터가 stale 상태로 전환되면, 다음 요청 시 새로운 데이터를 가져옴
useQuery(['todos'], fetchTodos, {
staleTime: 5000,
});
gcTime
- 캐시된 데이터가 메모리에서 제거되기 전까지 유지되는 시간
- 기본값
5*60*1000 5분
- 사용되지 않는 캐시 데이터를 메모리에서 제거하기까지의 시간
- 데이터가 없는 상태로 gcTime 만큼 유지되면 메모리에서 제거됨
- 보관기간을 제어하며, 데이터를 다시 사용하려면 새로 가져와야함
useQuery(['todos'], fetchTodos, {
cacheTime: 10000,
});
gcTime의 사용 이유
- 사용자에게 fetch 되기 이전의 데이터를 먼저 빠르게 렌더링하여 보여줌으로 사용자 경험을 향상시킴
- 단, 메모리 사용량이 늘어남
→ gcTime을 조금 더 길게 설정하여 균형을 유지하는 것이 적절하다
