Trung BìnhVue.js iconVue.js

Lazy loading components trong Vue?

Dùng dynamic import để lazy load component — chỉ download khi cần:

javascript
import { defineAsyncComponent } from 'vue'

// Basic
const HeavyChart = defineAsyncComponent(() =>
  import('./components/HeavyChart.vue')
)

// Với loading/error states
const AsyncComp = defineAsyncComponent({
  loader: () => import('./HeavyComponent.vue'),
  loadingComponent: LoadingSpinner,
  errorComponent: ErrorDisplay,
  delay: 200,      // delay trước khi show loading
  timeout: 3000,   // timeout sau 3s
})

Kết hợp với <Suspense> để handle loading state elegantly.

Xem toàn bộ Vue.js cùng filter theo level & chủ đề con.

Mở danh sách Vue.js