client:idle
The client:idle directive hydrates a component once the browser is idle after initial load.
Syntax
<Widget client:idle />Examples
---
import NewsletterForm from '../components/NewsletterForm.jsx';
---
<NewsletterForm client:idle />
<NewsletterForm client:idle={{ timeout: 2000 }} />
Output
Defers hydration until requestIdleCallback fires, optionally capped at a 2 second timeout.
Notes
Good default for components that are useful but not immediately critical. It uses requestIdleCallback so high-priority work loads first. Accepts an optional timeout option.