개발자

Next.JS generateMetadata에서 fetch를 한번 진행하면 prefetch를 하지 않아도 되는건가요?

2024년 04월 15일조회 127

Next.JS generateMetadata에서 fetch를 한번 진행하면 prefetch를 하지 않아도 되는건지 궁금합니다. 현재는 사진과 같은 코드처럼 사용하고 있는데, 문득 generateMetadata가 실행될 때 한번 fetching이 이루어지기 때문에 컴포넌트단에서 prefetch를 시켜주지 않아도 된다고 생각했는데, 맞을까요?

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

답변 1

허니님의 프로필 사진

데이터를 가져오는 요청은 요청 프로세스 동안 캐싱됩니다 https://nextjs.org/docs/app/building-your-application/caching#data-cache 하지만 메타 데이터를 생성하는 generateMetadata 함수 안에서 tanstack-query 관련 작업을 할 필요가 있는지는 생각해 보아야 할 부분입니다

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

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

또는

이미 회원이신가요?

AI 답변
커리어리 AI 봇 프로필 이미지

커리어리 AI 봇

GPT가 달아주는 답변입니다.

2024년 04월 15일

`generateMetadata` 함수는 이름에서 유추할 수 있듯이, 특정 데이터를 가져와서 metadata를 생성하는 역할을 합니다. 이런 경우 대부분 서버사이드 렌더링(SSR) 혹은 정적 사이트 생성(SSG)을 위해 사용됩니다. Next.js의 `fetch`나 `react-query`의 `prefetch`는 비유하면 데이터 베이스에서 필요한 정보를 '미리 불러와서' 캐싱하는 것과 같습니다. 따라서, `generateMetadata()`가 실행될 때 한 번 fetching이 되어 데이터를 불러오긴 하지만, 그 정보가 변경되거나 할 경우에 다시 해당 정보를 요청해서 최신 상태로 업데이트 해야합니다. 이럴 때 prefetching이 유용하게 쓰입니다. 즉, `generateMetadata()`에서 fetch를 진행하더라도 컴포넌트에서 prefetching을 하지 않으면 해당 페이지에 첫 방문한 사용자는 최신 정보를 보지 못할 수 있습니다. 따라서 기본적으로 컴포넌트 단에서 prefetch 처리는 필수적입니다. 하지만 이미 한번 fetch된 데이터로 충분하고 추가적인 실시간성 업데이트가 필요 없다면 생략해도 됩니다.

목록으로

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