Встречается на собеседованиях • сегодня

Зачем нужен defineAsyncComponent

defineAsyncComponent в Vue 3 позволяет асинхронно загружать компоненты, что особенно полезно для оптимизации производительности. Он откладывает загрузку компонента до момента его фактического использования, уменьшая начальный размер бандла.

Пример:

javascript
import { defineAsyncComponent } from 'vue';

const AsyncComponent = defineAsyncComponent(() =>
import('./components/MyComponent.vue')
);

text

Ключевые преимущества:
1. Ленивая загрузка - компонент загружается только при рендере
2. Разделение кода - компонент выносится в отдельный чанк
3. Можно добавить состояние загрузки/ошибки:
```javascript
const AsyncComponent = defineAsyncComponent({
  loader: () => import('./MyComponent.vue'),
  loadingComponent: LoadingSpinner,
  errorComponent: ErrorComponent,
  delay: 200, // задержка перед показом loading
  timeout: 3000 // таймаут ошибки
});

Используется для крупных редко используемых компонентов, модальных окон, роут-уровневых компонентов.

Sophi
Софи собрала все вопросы. Тренируйся и получай
офферы быстрее!
Попробовать бесплатноArrow

Следующий вопрос

Это единственный вопрос по вашему фильтру

как отвечать на вопрос
пример собеседования
фреймворки на собеседовании
типичные вопросы junior
интервью вопросы и ответы