Улучшить эту документациюЗапуск приложения AngularJS в режиме производства

При запуске приложения AngularJS в режиме производства следует учитывать несколько моментов.

Отключение отладочных данных

По умолчанию AngularJS прикрепляет информацию о привязке и областях видимости к узлам DOM и добавляет CSS классы к элементам с привязкой к данным:

• В результате интерполяций ngBind, ngBindHtml или {{...}} данные привязки и CSS класс ng-binding прикрепляются к соответствующему элементу.

• Там, где компилятор создал новую область видимости, область видимости и CSS класс ng-scope или ng-isolated-scope прикрепляются к соответствующему элементу. К этим ссылкам на области видимости можно получить доступ через element.scope() и element.isolateScope().

• Комментарии-заполнители для структурных директив будут содержать информацию о том, какая директива и привязка вызвали заполнитель. Например, <!-- ngIf: shouldShow() -->.

Инструменты, такие как Protractor и Batarang, нуждаются в этой информации для работы, но вы можете отключить её в режиме производства для значительного повышения производительности с помощью:

myApp.config(['$compileProvider', function ($compileProvider) {
  $compileProvider.debugInfoEnabled(false);
}]);

Если вам нужно отладить приложение с этой информацией, откройте консоль отладки в браузере, а затем вызовите этот метод непосредственно в этой консоли:

angular.reloadWithDebugInfo();

Страница должна перезагрузиться, и отладочная информация теперь должна быть доступна.

Для получения более подробной информации см. страницы документации по $compileProvider и angular.reloadWithDebugInfo.

Режим строгой инъекции зависимостей

Использование режима строгой инъекции зависимостей в вашем приложении в режиме производства будет вызывать ошибки, когда инъекционная функция не явным образом анотирована. Режим строгой инъекции зависимостей призван помочь вам убедиться, что ваш код будет работать при минификации. Однако он также заставит вас убедиться, что ваши инъекционные функции явно анотированы, что улучшит производительность Angular при инъекции зависимостей в ваши инъекционные функции, поскольку Angular не должен динамически обнаруживать зависимости функции. Рекомендуется автоматизировать явную аннотацию с помощью инструмента, такого как ng-annotate, при развертывании в режиме производства (и включении режима строгой инъекции зависимостей).

Чтобы включить режим строгой инъекции зависимостей, у вас есть два варианта:

<div ng-app="myApp" ng-strict-di>
  <!-- your app here -->
</div>

или

angular.bootstrap(document, ['myApp'], {
  strictDi: true
});

Для получения дополнительной информации см. Руководство по DI.

Отключение директив комментариев и CSS классов

По умолчанию AngularJS компилирует и выполняет все директивы внутри комментариев и классов элементов. Для выполнения этой задачи компилятор AngularJS должен искать директивы следующим образом:

• Проанализировать все классы элементов вашего приложения.

• Проанализировать все HTML комментарии вашего приложения.

В настоящее время большинство проектов AngularJS используют только директивы элементов и атрибутов, и в таких проектах нет необходимости компилировать комментарии и классы.

Если вы уверены, что ваш проект использует только директивы элементов и атрибутов, и вы не используете стороннюю библиотеку, которая использует директивы внутри классов элементов или HTML комментариев, вы можете отключить компиляцию директив в классах элементов и комментариях для всего приложения. Это приводит к повышению производительности компиляции, так как компилятор не должен проверять комментарии и классы элементов, ища директивы.

Для отключения директив комментариев и CSS классов используйте $compileProvider.

$compileProvider.commentDirectivesEnabled(false);
$compileProvider.cssClassDirectivesEnabled(false);

Для получения дополнительной информации см. страницы документации по $compileProvider.commentDirectivesEnabled и $compileProvider.cssClassDirectivesEnabled.