Next.js 'use cache'로 컴포넌트 캐싱, 더 쉽고 강력하게!
by DD
1년 전
조회수 6
'use cache' 디렉티브를 통해 Next.js에서 데이터 또는 컴포넌트를 쉽게 캐싱
컴파일러가 'use cache'를 인식하여 의존성 자동 관리 및 캐시 키 생성
직렬화 및 참조 방식을 통해 비직렬화 가능한 값도 효율적으로 캐싱
'use cache'의 작동 원리
'use cache'는 Next.js 컴파일러에게 캐싱 영역을 지정하는 지시어이다. 구체적으로, 컴파일 시 의존성 분석을 통해 캐시 키를 자동으로 생성한다. 따라서 개발자는 캐시 키 관리에 대한 부담 없이 캐싱을 적용할 수 있으며, 서버 컴포넌트의 성능을 향상시킨다.
Directive vs. Function: 장단점 비교
Directive 방식인 'use cache'는 클로저 내부 변수까지 캐시 키에 포함하여 안정적인 캐싱을 보장한다. 반면, cache() 함수는 수동적인 캐시 키 지정을 요구하여 캐시 키 누락의 위험이 있다. 결과적으로, 'use cache'는 개발 편의성과 를 동시에 잡았다.
