인프런 영문 브랜드 로고
인프런 영문 브랜드 로고

Inflearn Community Q&A

Next + Create a SNS service with React Query

[Next 15]Changed fetch cache + Request Memoization & Data Cache

요청 메모화와 데이터 캐시에 대해 제가 이해한 것이 맞는지 궁금합니다

Resolved

Written on

·

44

·

Edited

1

아래가 제가 이해한 내용인데 맞을까요?

요청 메모화

  • ssr 요청 사이클 내에서만 페치 결과를 캐싱하여 중복 요청 방지 (한 서버 요청 사이클 끝나면 초기화)

  • 예를들어 Home컴포넌트와 자식 컴포넌트인 Header 컴포넌트에서 렌더링 시에 동일한 요청을 날렸다면 Home컴포넌트의 요청이 캐싱되고 Header 컴포넌트의 요청은 캐싱된 값 사용

데이터 캐시

  • ssr 요청 사이클 내 뿐만 아니라 서버에 전역적으로 유지되는 캐시

  • 요청 메모화와 다르게 서버 요청 끝나도 초기화되지 않고 지속됨

  • 즉, 여러 클라이언트 요청 간에도 유지됨

    • A가 먼저 페이지 요청 → 백엔드에 요청 후 넥스트 서버에 데이터 캐싱

    • B가 같은 페이지 요청 → 백엔드 요청 없이 넥스트 서버 캐시에서 데이터 반환

결론
즉, 요청 메모화는 렌더링 최적화, 데이터 캐시는 네트워크 요청 절약을 위한 것

reactnext.jsreact-querynext-authmsw

Answer 1

1

zerocho님의 프로필 이미지
zerocho
Instructor

네 정확합니다!