Next.js 16.3: 즉각적인 네비게이션

원문: Next.js 16.3: Instant Navigations

— Next.js Blog 이 글은 원문의 핵심 내용을 요약한 것입니다. 저작권은 원문 저자에게 있으며, 자세한 내용은 원문에서 확인하세요.

• Cache Components

  활성화: 새로운 동작을 위해

  cacheComponents

  플래그를 활성화합니다. 이 기능은 향후 주요 버전에서 기본값으로 설정될 예정입니다.

• Stream

  과

  Cache

  옵션: 비동기 작업을

  Suspense

  를 사용한

  Stream

  또는

  'use cache'

  를 사용한

  Cache

  로 전환하여 사용자가 즉시 로딩 상태 또는 이전 UI를 볼 수 있도록 합니다. 이를 통해 네비게이션이 SPA처럼 느껴지도록 합니다.

• Block

  옵션: 특정 네비게이션을 서버 바운드로 유지하고자 할 때

  export const instant = false

  를 사용하여 즉각적인 네비게이션을 강제하지 않도록 할 수 있습니다.

• Partial Prefetching

  도입: 링크당 개별 요청 대신, 라우트별로 재사용 가능한 로딩 쉘(shell)을 사전 로드하여 클라이언트에 캐시합니다. 이를 통해 불필요한 요청을 줄이고 네비게이션 속도를 향상시킵니다.
• 향상된 개발 및 테스트 도구:

  instant()

  Playwright 테스트 헬퍼와 Navigation Inspector를 통해 개발 과정에서 즉각적인 라우트의 회귀를 방지하고 시각적으로 검사할 수 있습니다.

cacheComponents: true

partialPrefetching: true