Nuxt/docs/3.api/3.utils/create-idle-loader.md

967 B

title description links
createIdleLoader A utility function to customize delayed hydration based on network idle time.
label icon to size
Source i-simple-icons-github https://github.com/nuxt/nuxt/blob/main/packages/nuxt/src/app/composables/hydrate.ts xs

You can use this utility to customize the timeout of delayed hydration components based on network idle time.

Parameters

  • options: { timeout }

Example

If you would like to give a timeout of 5 seconds for the components:

<template>
  <div>
    <LazyIdleMyComponent :hydrate="createIdleLoader({timeout: 3000})"/>
  </div>
<template>

::read-more{to="/docs/guide/directory-structure/components#delayed-hydration"} ::

::read-more{to="https://developer.mozilla.org/en-US/docs/Web/API/Window/requestIdleCallback"} This is based on the requestIdleCallback web API, and therefore only accepts the timeout prop, which should be a number. ::