|
35 | 35 | 4. [React Query 캐싱 라이프 사이클](#캐싱-라이프-사이클) |
36 | 36 | 5. [useQuery](#usequery) |
37 | 37 | 6. [useQuery 주요 리턴 데이터](#usequery-주요-리턴-데이터) |
38 | | -7. [staleTime과 cacheTime](#staletime과-cachetime) |
| 38 | +7. [staleTime과 gcTime](#staletime과-gctime) |
39 | 39 | 8. [마운트 될 때마다 재요청하는 refetchOnMount](#refetchonmount) |
40 | 40 | 9. [윈도우가 포커싱 될 때마다 재요청하는 refetchOnWindowFocus](#refetchonwindowfocus) |
41 | 41 | 10. [Polling 방식을 구현하기 위한 refetchInterval와 refetchIntervalInBackground)](#polling) |
@@ -314,7 +314,7 @@ const useSuperHeroData = (heroId: string) => { |
314 | 314 | return useQuery({ |
315 | 315 | queryKey: ["super-hero", heroId], |
316 | 316 | queryFn: () => getSuperHero(heroId), |
317 | | - cacheTime: 5 * 60 * 1000, // 5분 |
| 317 | + gcTime: 5 * 60 * 1000, // 5분 |
318 | 318 | staleTime: 1 * 60 * 1000, // 1분 |
319 | 319 | retry: 1, |
320 | 320 | // ... options |
@@ -422,7 +422,7 @@ const { |
422 | 422 | - 여기서 주의할 점은 staleTime과 gcTime의 기본값은 각각 `0분`과 `5분`이다. 따라서 staleTime에 어떠한 설정도 하지 않으면 해당 쿼리를 사용하는 컴포넌트(Observer)가 mount됐을 때 매번 다시 API를 요청할 것이다. |
423 | 423 | - staleTime을 gcTime보다 길게 설정했다고 가정하면, staleTime만큼의 캐싱을 기대했을 때 원하는 결과를 얻지 못할 것이다. 즉, 두 개의 옵션을 적절하게 설정해줘야 한다. |
424 | 424 | - 참고로, [TkDodo의 reply](https://github.com/TanStack/query/discussions/1685#discussioncomment-1876723)에 따르면 TkDodo는 `staleTime을 gcTime보다 작게 설정하는 것이 좋다.`는 의견에 동의하지 않는다고 한다. |
425 | | - - 예컨대, staleTime이 60분일지라도 유저가 자주 사용하지 않는 데이터라면 굳이 cacheTime을 60분 이상으로 설정하여 메모리를 낭비할 필요가 없다. |
| 425 | + - 예컨대, staleTime이 60분일지라도 유저가 자주 사용하지 않는 데이터라면 굳이 gcTime을 60분 이상으로 설정하여 메모리를 낭비할 필요가 없다. |
426 | 426 |
|
427 | 427 | <br /> |
428 | 428 |
|
|
0 commit comments