preloadRouteComponents

preloadRouteComponents를 사용하면 Nuxt 앱의 개별 페이지를 수동으로 미리 로드할 수 있다.

경로를 미리 로드하면 사용자가 나중에 탐색할 수 있는 특정 경로의 컴포넌트가 로드됩니다. 이렇게 하면 구성 요소를 더 빨리 사용할 수 있고 탐색을 차단할 가능성이 줄어들어 성능이 향상된다.

Nuxt 는 NuxtLink 구성 요소를 사용하는 경우 필요한 경로를 이미 자동으로 미리 로드한다.

 

참고) Nuxt-Component > NuxtLink

 

사용 예

navigateTo 사용 시 경로를 미리 로드

// we don't await this async function, to avoid blocking rendering
// this component's setup function
preloadRouteComponents('/dashboard')

const submit = async () => {
  const results = await $fetch('/api/authentication')

  if (results.token) {
    await navigateTo('/dashboard')
  }
}

참고) Nuxt-Utils > navigateTo

서버에서 preloadRouteComponents 는 아무런 효과가 없다.