개발자

react-query가 데이터를 캐싱하는거 맞나요?

2023년 02월 23일조회 329

이번에 react-query를 처음 사용해 보는데요. 데이터를 키에 캐싱해서 보여준다고 공식문서에 적혀있던데 사용해보면서 느낀건 캐싱되고 있는거 맞는지 의문점이 생깁니다. 가장 큰 이유는 데이터를 계속 불러오기 때문입니다. 캐싱된 데이터를 가지고 어느정도 API요청을 줄이고 효율적으로 사용할 수 있을 줄 알았는데 매번 hook을 실행할 때마다 혹은 데이터와 관련없는 버튼을 누를때도 렌더링 될때마다 API요청이 일어나더라고요. 물론 제가 처음이라 잘 사용하는 방법을 몰라서 그렇기도 한데 이렇게 사용하는 거라면 더 비효율적인것 같아요 ㅜㅜ

이 질문이 도움이 되었나요?
'추천해요' 버튼을 누르면 좋은 질문이 더 많은 사람에게 노출될 수 있어요. '보충이 필요해요' 버튼을 누르면 질문자에게 질문 내용 보충을 요청하는 알림이 가요.
profile picture
익명님의 질문

답변 2

인기 답변

엄홍재님의 프로필 사진

react-qeury는 가지고 있는 데이터가 항상 최신이라고 생각하지 않아요. 그래서 항상 데이터를 가져오게 됩니다 이를 어느정도 방지하기 위해서 staleTime을 주면 됩니다. 그러면 해당 시간동안은 데이터가 최신이라고 판단하고 이후에는 stale하다고 해서 다시 데이터를 가져오게 됩니다. 공식문서 : The time in milliseconds after data is considered stale. This value only applies to the hook it is defined on. 그래서 결론은 '캐싱하고 있는것은 맞고 데이터를 또 불러오는 동안 캐시된 데이터를 보여주게됩니다. 데이터를 불러오는 건 staleTime을 통해 조절할 수 있다.' 입니다

profile picture

익명

작성자

2023년 02월 27일

감사합니다 홍재님!!

hvp님의 프로필 사진

우선 캐싱하는게 맞습니다. Api 응답을 기다리는 동안 캐싱된 데이터를 보여주고, 응답이 오면 그 최신 데이터로 갱신합니다. 즉, 아무 options 없이 사용하면 컴포넌트가 마운트 될때마다 새로운 요청을 보냅니다. staleTime, cacheTime등의 option으로 원하는 동작을 하도록 할 수 있습니다.

profile picture

익명

작성자

2023년 02월 24일

오 그렇군요!! 많은 도움이 되었습니다 감사합니다!

지금 가입하면 모든 질문의 답변을 볼 수 있어요!

현직자들의 명쾌한 답변을 얻을 수 있어요.

또는

이미 회원이신가요?

목록으로
키워드로 질문 모아보기

실무, 커리어 고민이 있다면

새로운 질문 올리기

지금 가입하면 모든 질문의 답변을 볼 수 있어요!