Как работает система загрузки компонентов Vue 3 при использовании Promise?

Система загрузки компонентов Vue 3 при использовании Promise работает следующим образом: borstch.com

1. Для определения асинхронного компонента используется функция defineAsyncComponent. ru.vuejs.org vueframework.com Она принимает функцию загрузчика, которая возвращает Promise. ru.vuejs.org
2. Коллбэк Promise resolve вызывается, когда получено определение компонента с сервера. ru.vuejs.org vueframework.com Также можно вызвать reject(reason), чтобы указать, что загрузка не удалась. ru.vuejs.org
3. Полученный компонент является обёрткой, которая вызывает функцию загрузчика только при фактической отрисовке на странице. ru.vuejs.org
4. Если предоставлен компонент загрузки, он будет отображаться сначала, пока загружается внутренний компонент. ru.vuejs.org
5. Если предоставлен компонент ошибки, он будет отображаться, когда Promise, возвращаемый функцией загрузчиком, будет отклонён. ru.vuejs.org

Такая система позволяет загружать компоненты только тогда, когда они необходимы, что экономит ресурсы и ускоряет процесс начальной отрисовки. borstch.com