Angular 2 Сравнение AOT и JIT полезной нагрузки

Я новичок в Angular 2, поэтому исправьте меня, если я неточен.

Мое понимание Angular 1 против 2, когда дело доходит до компилятора:

В Angular 1 компилятор более общий и динамический, что означает, что грязный проверяющий код - это один код, работающий на разных компонентах. Однако для производительности в Angular 2 каждый компонент будет скомпилирован с сгенерированным кодом, который обрабатывает привязки и выполняет грязную проверку для этого конкретного компонента. Это означает, что в зависимости от шаблона компонента, более конкретно количество привязок, сгенерированный код становится больше.

Когда мы используем JIT, это не важно, поскольку этот код не проходит через сеть и генерируется в браузере. Но при использовании AOT он будет передан с сервера.

Проблема (возможно):

Когда приложение малое, AOT, безусловно, приведет к меньшей полезной нагрузке, поскольку компилятор не будет отправлен в браузер. Но по мере того, как приложение растет, я предполагаю, что эта разница начинает уменьшаться и может быть перевернута (это так?!). Но у меня нет количественного смысла. Будет ли это реальной проблемой для приложений среднего или крупного масштаба?

Ответ 1

Чтобы ответить на вопрос "Но по мере того, как приложение растет, я предполагаю, что эта разница начинает уменьшаться и может быть перевернута (это?)":

Да, это так, в очень большом приложении разница может быть видна.

Я задал аналогичный вопрос в стартовом github webpack, чтобы процитировать ответ:

Вы могли заметить, что основной файл и файлы chunk больше в сборке: prod: aot then in build: prod, это совершенно нормально, поскольку AOT создает больше кода. Общая сумма меньше в AOT, поскольку компилятор не является частью пакета, вы можете увидеть его в размере пакета поставщиков. Это также означает, что по мере роста вашего приложения AOT даст более высокий код, так как вы добавите больше сгенерированного кода AOT, но размер компилятора будет постоянным. Команда angular работает над сокращением испускаемого кода, одна из предстоящих функций - это новый механизм просмотра, который уменьшит размер пакета, но будет слегка влиять на производительность (всегда это компромисс).

Тем не менее, приложения начинают быстрее с AOT, чем JIT. Посмотрите на проблему, кажется, что команда angular2 знает об этом и планирует уменьшить это поведение.

https://github.com/AngularClass/angular2-webpack-starter/issues/1520

Проблема для отслеживания команды angular2: https://github.com/angular/angular/issues/14013

UPDATE: теперь живи с angular 4 https://github.com/angular/angular/blob/master/CHANGELOG.md#view-engine

Weve внесла изменения в капот к тому, что выглядит сгенерированный код AOT. В некоторых случаях эти изменения должны уменьшить размер сгенерированного кода для ваших компонентов более чем наполовину. Прочтите проект Doc для обновлений Engine Engine.

Ответ 2

Решение состоит в том, чтобы фактически управлять AOT с помощью LazyLoading.

Чтобы действительно дать ответ, будут проблемы, но теперь у нас есть инструменты для их управления. Lazy Loading - это решение, которое мы не можем легко применить к AngularJS.

Проверьте эту ссылку, которая действительно хорошо сделана и охватывает весь вопрос о модулях, контекстах и ​​компиляции: http://blog.angular-university.io/angular2-ngmodule/

Вы также можете комбинировать оба и получить лучшее из них: http://blog.assaf.co/angular-2-harmony-aot-compilation-with-lazy-jit-2/