StaleTime vs CacheTime

https://velog.io/@yrnana/React-Query%EC%97%90%EC%84%9C-staleTime%EA%B3%BC-cacheTime%EC%9D%98-%EC%B0%A8%EC%9D%B4

• staleTime
  • refetch 하는 기준이 되는 시간
  • stale 할 때는, re-rendering 되어도 fetch를 하지 않는다.
• cacheTime
  • fetch 되었을때, 캐싱된 데이터의 유지시간
  • 캐싱이 되어있다면 fetch되더라도 네트워크를 타지 않는다.
• stale이든 cache든 둘의 시간이 유효하다면 네트워크탭에선 결국 감지할 수 없다.

react lazy query

• useQuery의 enable 옵션을 true로 설정
• 쿼리키를 state로 관리하고,
• fetch 메소드를 구현해둔다.
  • 쿼리키 삭제
  • 쿼리키 다시 세팅

lottie

https://www.youtube.com/watch?v=nrQkeorPCv0&list=PLkbzizJk4Ae9c78CwuPVFFSIz8EnhmFQt&index=2

• airbnb에서 만든 라이브러리
• 모션그래픽을 json 포맷으로 작성하면 화면에 그려준다.
• after Effect => json format export => web 순으로 이루어진다.

cookie path

cache path는 처음 진입한 root 페이지를 기준으로 생성된다.

ex)

• blahblah.com/coupon/team 으로 접속 후 쿠키를 세팅했을 때
  • cache의 path는 /coupon 이 된다.
• blahblah.com 접속 -> blahblah/coupon/team 이동 후 쿠키를 세팅했을 때
  • cache의 apth는 /가 된다.

이렇게되면 하나의 웹 애플리케이션에 2개의 쿠키가 세팅되었고,
같은 페이지라도 어떤 페이지를 시작으로 진입했느냐에 따라 다른 쿠키값이 읽어져버린다.

hotfix 때 고려해야할 것

• 현재 작성하는 데이터가 서버에 저장되어있는 데이터는 아닌지 확인할 것
• 기존 사용자들에게 데이터적인 영향을 미치진 않는지 확인할 것
• 데이터적인 영향이 있다면 마이그레이션이 가능한지 고려할 것
• 서버에 영향이있다면 모든 구성원에 공유가 필요하다. 잠수함패치 불가