Skip to content

Instantly share code, notes, and snippets.

@antlis

antlis/define-lazy-component.ts

Created April 16, 2026 20:19
Show Gist options

  • Select an option

    Learn more about clone URLs
  • Save antlis/80202bfbd1318fb8faf285896123f618 to your computer and use it in GitHub Desktop.

Select an option

Learn more about clone URLs
Save antlis/80202bfbd1318fb8faf285896123f618 to your computer and use it in GitHub Desktop.
Download ZIP
Lightweight helper for lazy-loading components to improve performance metrics like LCP and INP.
Raw
define-lazy-component.ts
export function defineLazyComponent(loader: () => Promise<any>) {
return defineAsyncComponent({
loader,
suspensible: false,
})
}
@antlis
Copy link
Copy Markdown
Author

antlis commented Apr 16, 2026

Use case:

const HeavyChart = defineLazyComponent(() => import('@/components/HeavyChart.vue'))

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment