preloadRouteComponents를 사용하면 Nuxt 앱의 개별 페이지를 수동으로 미리 로드할 수 있다. 경로를 미리 로드하면 사용자가 나중에 탐색할 수 있는 특정 경로의 컴포넌트가 로드됩니다. 이렇게 하면 구성 요소를 더 빨리 사용할 수 있고 탐색을 차단할 가능성이 줄어들어 성능이 향상된다. Nuxt 는 NuxtLink 구성 요소를 사용하는 경우 필요한 경로를 이미 자동으로 미리 로드한다. 참고) Nuxt-Component > NuxtLink 사용 예 navigateTo 사용 시 경로를 미리 로드 // we don't await this async function, to avoid blocking rendering // this component's setup function preloadRou..

Nuxt는 미리 로드된 컴포넌트를 제어할 수 있는 유틸리티를 제공한다. 컴포넌를 미리 로드하면 페이지에 곧 필요할 컴포넌트(렌더링 수명 주기 초기에 로드를 시작하려는 구성 요소)가 로드된다. 이렇게 하면 더 빨리 사용할 수 있고 페이지 렌더링을 차단할 가능성이 낮아져 성능이 향상된다. preloadComponents 를 사용하여 Nuxt 앱에 전역적으로 등록된 개별 구성 요소를 수동으로 미리 로드하자. 기본적으로 Nuxt 는 이를 비동기 컴포넌트로 등록합니다. 파스칼 형식의 구성요소 이름을 사용해야 한다. await preloadComponents('MyGlobalComponent') await preloadComponents(['MyGlobalComponent1', 'MyGlobalComponent2'..

Nuxt 는 컴포넌트를 프리페치 할 수 있는 유틸리티를 제공한다. 프리페칭 컴포넌트는 백그라운드에서 코드를 다운로드한다. 이는 구성 요소가 렌더링에 사용될 가능성이 높다는 가정을 기반으로 하며 사용자가 요청할 경우 컴포넌트가 즉시 로드될 수 있도록 한다. 사용자가 명시적으로 요청하지 않고도 향후 사용을 위해 컴포넌트가 다운로드되고 캐시된다. prefetchComponents 를 사용하여 Nuxt 앱에 전역적으로 등록된 개별 구성 요소를 수동으로 미리 가져온다. 기본적으로 Nuxt 는 이를 비동기 컴포넌트로 등록합니다. 파스칼 형식의 컴포넌트 이름을 사용해야 한다. await prefetchComponents('MyGlobalComponent') await prefetchComponents(['MyGlob..

onNuxtReady 컴포저블을 사용하면 앱 초기화가 완료된 후 콜백을 실행할 수 있다. onNuxtReady 는 클라이언트 측에서만 실행된다. 앱의 초기 렌더링을 차단하지 않는 코드를 실행하는 데 이상적이다. // plugins/ready.client.ts export default defineNuxtPlugin(() => { onNuxtReady(async () => { const myAnalyticsLibrary = await import('my-big-analytics-library') // do something with myAnalyticsLibrary }) }) 앱이 초기화된 후 안전하게 실행된다. 이 경우 다음 idle 콜백에서 실행되도록 코드가 등록된다.

onBeforeRouteUpdate 컴포저블을 사용하면 구성요소 내에 경로 가드를 등록할 수 있다. 현재 위치가 업데이트될 때마다 트리거되는 탐색 가드를 추가한다. beforeRouteUpdate 와 유사하지만 모든 컴포넌트에서 사용할 수 있다. 구성요소가 마운트 해제되면 가드가 제거된다. onBeforeRouteUpdate(updateGuard): void 매개변수​ Name Type Description updateGuard NavigationGuard 내비게이션가드 반환값​ void

onBeforeRouteLeave 컴포저블을 사용하면 구성요소 내에 경로 가드를 등록할 수 있다. onBeforeRouteLeave(leaveGuard): void 현재 위치의 컴포넌트가 떠날 때마다 트리거되는 탐색 가드를 추가한다. beforeRouteLeave와 유사하지만 모든 컴포넌트에서 사용할 수 있다. 컴포넌트가 마운트 해제되면 가드가 제거된다. 매개변수​ Name Type Description leaveGuard NavigationGuard NavigationGuard 반환값​ void