Варианты начальной загрузки Angular 2 — AOT против JIT

Просто начал с Angular 2.

  1. Каковы различные варианты начальной загрузки в angular 2?

  2. Почему, когда я вношу изменения и обновляю index.html, требуется мало времени для извлечения разметки HTML?

  3. Различия между ними


person Aravind    schedule 08.12.2016    source источник
comment
FWIW есть также Angular Universal, который я не видел в других ответах, так что в основном загружайте начальную страницу/модуль/любую сторону сервера, а затем повторно увлажняйте, как только приложение загружается на клиенте.   -  person Zlatko    schedule 25.07.2018


Ответы (2)


Есть два варианта

  1. Динамическая загрузка

    • compiler used JIT (Just in Time).
    • динамически компилирует файлы ts в браузере.
    • по этой причине index.html требует мало времени для извлечения разметки.
    • main.ts содержит следующее

      import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
      import { AppModule }              from './app.module';
      
      platformBrowserDynamic().bootstrapModule(AppModule);
      
      1. Static bootstrapping
    • компилятор использовал AoT (Ahead of Time).
    • Файлы ts компилируются в файлы js, а затем отображаются в браузере.
    • Таким образом, там создается набор js-файлов, содержащих модули и фабрики, что делает их легкими.
    • В основном используется в случае с мобильными телефонами и устаревшими сетями.
    • main.ts содержит следующее

      import { platformBrowser } from '@angular/platform-browser';
      import { AppModuleNgFactory }              from '../aot/app/app.module.ngfactory';
      
      platformBrowser().bootstrapModuleFactory(AppModuleNgFactory);
      

Различия введите здесь описание изображения

person Aravind    schedule 08.12.2016
comment
Вы могли бы упомянуть, что все эти преимущества в AoT оплачиваются немного более длительным временем компиляции. AoT также поддерживается angular-cli, что делает его незаметным во время разработки. - person Kornel Dylski; 03.07.2017

В Angular есть два способа компиляции

  • JIT — своевременная компиляция AOT
  • Заблаговременная компиляция

Я хотел бы добавить четыре основных различия, когда дело доходит до компиляции JIT и AOT.

|----------------------------------------|---------------------------------------------|
|                    JIT                 |                   AOT                       |
|----------------------------------------|---------------------------------------------|
| JIT compilation as the name implies,   | AOT compilation compiles the application at |
| compiles  the application Just in Time | build time                                  |
| in the browser at runtime              |                                     |
|----------------------------------------|---------------------------------------------|
|For JIT compilation the browser needs to| AOT compilation it does not have to         |
|download the angular compiler           |                                             |
|----------------------------------------|---------------------------------------------|
|While the application is being JIT      | With AOT, the application is precompiled    | 
|compiled in the browser, users have     | so there no such wait                       |
|to wait                                 |                                             |
|----------------------------------------|---------------------------------------------|
|With JIT compilation, the template      | With AOT compilation we will come to        |
|binding errors are only know at runtime | now about them at build time.               |
|----------------------------------------|---------------------------------------------|   

По умолчанию следующие 2 команды используют JIT-компиляцию.

ng build
ng serve

С помощью любой из этих команд мы можем использовать параметр - -aot для включения AOT.

ng build --aot
ngserve --aot

Чтобы отключить ACT для рабочей сборки, установите для параметра - - aot значение false.

 ng build -- prod --aot false
person Sajeetharan    schedule 25.07.2018
comment
в чем смысл этого ответа? Вопрос о начальной загрузке с использованием platformBrowser/platformBrowserDynamic - person Zygimantas; 27.07.2018