AngularJS Version 1.3 hatte mehrere Neuerungen mit sich gebracht. Eine davon ist eine $rootScope-Funktion namens $applyAsync. Mit Hilfe dieser Funktion können wir Angular anweisen, $apply zu einem späteren Zeitpunkt aufzurufen. Laut AngularJS-Dokumentation wird der Aufruf um ~10 Millisekunden verzögert. Somit können wir mehrere Änderungen bündeln, die dann in einem $digest-Zyklus evaluiert werden. Die $applyAsync-Funktion hilft uns auch, $apply already in progress Exceptions zu vermeiden. Dies wird erreicht, indem man einfach den $apply-Aufruf durch einen $applyAsync-Aufruf ersetzt.

Aber jetzt zum eigentlichen Thema dieses Blog-Artikels, $applyAsync$ mit $http. Es ist oft der Fall, dass wir beim Laden einer AngularJS-Anwendung viele $http-Anfragen an den Server schicken, um Daten für die Anwendung zu bekommen. Jedes Mal, wenn eine Antwort vorliegt, wird AngularJS einen $digest-Zyklus starten, um die Daten zu evaluieren und anschließend anzuzeigen. Je mehr $digest-Zyklen die Anwendung durchlaufen muss, desto langsamer wird sie. Um die Anzahl der $digest-Zyklen zu reduzieren, können wir $applyAsync nutzen. AngularJS bietet uns einen sehr einfachen Weg, um mehreren $http-Antworten, die fast zeitgleich ankommen, in einem $applyAsync-Aufruf zu bündeln. Dafür müssen wir nur den $httpProvider konfigurieren. Wie das geht, zeige ich im Code-Beispiel unten.

  // Neue angular App definieren
  angular.module('testApp', []).
    config(function($httpProvider) {
      // $http soll $applyAsync nutzen für die Antworten
      $httpProvider.useApplyAsync(true);
    });

Diese paar Zeilen Code können erhebliche Verbesserungen der Performance bewirken, vor allem bei größeren Anwendungen, die in einem begrenzten Zeitraum mehrere Antworten auf $http-Anfragen bekommen.