React-Query (2)

우현민·2021년 4월 19일
2
post-thumbnail

Defaults

react-query에는 분명하게 알아둬야 할 default한 사항들이 있다. 모르고 넘어가면 나중에 왜 안 되는지 골치아플 확률이 높으니 분명하게 알아두자.

  1. useQuery, useInfiniteQuery 의 staleTime
    1. 옵션에서 조작 가능하며 default는 5분이다.
  2. query는 다음 상황에 자동으로 reFetch되며, 각각에 해당하는 옵션을 조작하여 수정 가능하다.
    1. 쿼리에 새 인스턴스가 mount될 때
    2. 윈도우가 refocus됐을 때
    3. 네트워크가 다시 연결됐을 때
    4. (optional) refetch interval에 의해
  3. useQuery, useInfiniteQuery 등에 의해 관찰되지 않는 데이터는 inactive 라벨이 붙는다.
    • 일정 시간(cacheTime)이 지나면 inactive query는 버려진다.
    • cacheTime옵션 기본값은 5분 == 1000 * 60 * 5 ms이다.
  4. 실패한 쿼리는 exponential backoff delay를 두고 세 번 다시 시도된다.
  5. structural sharing이라는 말이 있는데, 무슨 말인지 잘 모르겠고 99.9%의 확률로 이 옵션을 끌 리가 없다고 하는 걸 보니 크게 중요해 보이진 않는다. 대신 원문을 첨부한다.

Query results by default are structurally shared to detect if data has actually changed and if not, the data reference remains unchanged to better help with value stabilization with regards to useMemo and useCallback. If this concept sounds foreign, then don't worry about it! 99.9% of the time you will not need to disable this and it makes your app more performant at zero cost to you.

profile
프론트엔드 개발자입니다

0개의 댓글