Компиляция

Поскольку разработка ведется на TypeScript, то для запуска в браузере приложение должно быть предварительно обработано компилятором Angular, который конвертирует код исходных файлов в исполняемый JavaScript.

Механизм Angular compile реализован в двух режимах:

JIT-компиляция (Just-in-TIme);
AOT-компиляция (Ahead-of-Time).
В режиме JIT (используется по умолчанию) приложение компилируется в момент его запуска в браузере.

В режиме AOT компиляция происходит в момент сборки приложения. Для этого при выполнении некоторых CLI-команд необходимо указать флаг --aot.


ng serve --aot
ng build --aot
При сборке приложения с флагом --prod AOT-компиляция используется по умолчанию.

Преимущества Angular AOT:

Быстрая загрузка в браузере. Меньше времени тратится за счет того, что:
Приложение компилируется до загрузки в браузер;
В сборку не включается компилятор Angular и, как следствие, конечные файлы имеют меньший размер;
Выполняется меньше AJAX-запросов на получение исходных HTML- и CSS-файлов, поскольку они включаются в строковом виде в файлы JavaScript.
Обнаружение ошибок при сборке. Имеется возможность исправить все ошибки до запуска приложения в режиме эксплуатации.
Повышенная безопасность.Поскольку HTML- и CSS-файлы включаются в процессе Angular compile в файлы JavaScript, то нет возможности просмотреть шаблоны, что снижает риск осуществления атак.
В режиме AOT нельзя использовать в конфигурационных объектах декораторов стрелочные функции.

Компиляцию Angular AOT можно разделить на три стадии:

Анализ. В процессе анализа формируются данные, необходимые для генерации кода. Это файлы определения типов (*.d.ts) и файлы, содержащие информацию о метаданных, указанных в декораторах (*.metadata.json). Также процесс анализа включает в себя некоторую оптимизацию кода.
Генерация кода. На этой стадии интерпретируются все файлы, сгенерированные на стадии анализа. Отдельно стоит упомянуть проверку модификаторов доступа свойств классов. Например, если свойство определено как private и используется в шаблоне, то будет сгенерирована соответствующая ошибка.
Валидация. На стадии валидации компилятор шаблонов использует компилятор TypeScript для проверки правильности использования свойств и методов компонентов и сервисов в шаблонах.
Как видно, AOT-компиляция имеет гораздо больше преимуществ перед JIT-компиляцией. Но сборка Angular AOT занимает гораздо больше времени. Поэтому рекомендуется при разработке использовать режим JIT, а для сборки версии и последующего ее развертывания - AOT.