Angular 6/7 по умолчанию использует нетерпеливую / ленивую загрузку?

Как сказано в заголовке, нужно ли нам вручную реализовать отложенную загрузку для модулей или Angular 6/7 делает это по умолчанию?


angular angular7 angular6
person Henry    schedule 16.11.2018    source источник

Ответы (2)


arrow_upward
9
arrow_downward

Angular по умолчанию использует активную загрузку, если не указано иное.

Чтобы реализовать отложенную загрузку, в RouterModule необходимо указать следующие параметры:

  1. Объект конфигурации маршрута с loadChildren вместо component. Присвоенное ему значение будет относительным путем к Lazy Loaded Module, за которым следует #, за которым следует имя модуля.

  2. Модуль с отложенной загрузкой также должен реализовывать в себе модуль маршрутизации, и там он должен вызывать forChild вместо forRoot.

В официальных документах Angular есть очень хорошее руководство, которое вы может следовать, чтобы реализовать ленивую загрузку модулей.

Вот Образец StackBlitz , которым вы можете следовать, чтобы реализовать отложенную загрузку.

person SiddAjmera    schedule 16.11.2018

arrow_upward
5
arrow_downward

Когда вы создаете приложение (с помощью ng build), оно объединяет его в несколько файлов сценариев * .js и добавляет ссылку на эти файлы сценариев в ваш файл index.html. Это файлы, которые вы развертываете на внутреннем сервере.

Когда пользователь обращается к вашему сайту (www.yoursite.com), он находит сервер, на котором размещен сайт, и извлекает файл index.html и все указанные файлы сценария, содержащие весь ваш код. Затем этот код загружается в браузер.

Ленивая загрузка включает в себя объединение вашего приложения в дополнительные пакеты, так что не все из него удаляется при закрытии файла index.html. Это улучшает «первую загрузку» вашей страницы для пользователя. Затем другие пакеты удаляются «по запросу» (то есть, когда пользователь обращается к маршруту по пути с отложенной загрузкой) или асинхронно в фоновом режиме после начальной загрузки.

По умолчанию Angular не выполняет отложенную загрузку. Это то, что вы определяете.

Сначала вы разделяете свое приложение на модули Angular. Ленивая загрузка определяется модулем. Каждый модуль определяет набор связанных компонентов, директив и каналов.

Затем вы используете специальный синтаксис для ленивой загрузки этих модулей, используя синтаксис в конфигурации маршрута, например:

  {
    path: 'products',
    loadChildren: './products/product.module#ProductModule'
  },

Затем Angular объединяет каждый модуль с отложенной загрузкой в ​​свой собственный файл сценария отдельно от сценариев, указанных в файле index.html.

Вы можете узнать больше здесь: https://angular.io/guide/lazy-loading-ngmodules < / а>

person DeborahK    schedule 16.11.2018
comment
Хорошо, думаю, я понял, но поправьте меня, если я ошибаюсь. Ленивая загрузка модуля - это то же самое, что ленивая загрузка компонента? Или это совсем другое? Или мы вообще не можем лениво загружать компоненты? Я новичок в Angular, поэтому пытаюсь осмыслить эти вещи. - person Henry; 16.11.2018
comment
@henry, модуль по сути является контейнером для компонентов, директив, каналов и т. д. Таким образом, ленивая загрузка модуля в конечном итоге приведет к ленивой загрузке компонентов, которые зарегистрированы (добавлены в массив declarations из @NgModule) в модуле. - person SiddAjmera; 16.11.2018
comment
Я расширил свой ответ, чтобы объяснить более подробно. - person DeborahK; 16.11.2018