Tricks for Angular performance

count-watchers.js

(function () {

  var root = angular.element(document.getElementsByTagName('body'));

  var countWatchers_ = function(element, scopes, count) {
    var scope;
    scope = element.data().$scope;
    if (scope && !(scope.$id in scopes)) {
      scopes[scope.$id] = true;
      if (scope.$$watchers) {
        count += scope.$$watchers.length;
      }
    }
    scope = element.data().$isolateScope;
    if (scope && !(scope.$id in scopes)) {
      scopes[scope.$id] = true;
      if (scope.$$watchers) {
        count += scope.$$watchers.length;
      }
    }
    angular.forEach(element.children(), function (child) {
      count = countWatchers_(angular.element(child), scopes, count);
    });
    return count;
  };

  window.countWatchers = function() {
    return countWatchers_(root, {}, 0);
  };

})();

identify-watchers.js

(function() {
 
    var root = $(document.getElementsByTagName('html'));
    var watchers = [];
    var attributes = [];
    var attributes_with_values = [];
    var elements = [];
    var elements_per_attr = [];
    var scopes = [];
 
    function include(arr, obj) {
        return (arr.indexOf(obj) != -1);
    }
 
    function is_not_duplicate(arr, obj) {
        if (typeof arr == "undefined") {
            return true;
        } else {
            if (include(arr, obj)) {
                return false;
            } else {
                return true;
            }
        }
 
    }
 
    var f = function(element) {
        angular.forEach(['$scope', '$isolateScope'], function (scopeProperty) { 
            if (element.data() && element.data().hasOwnProperty(scopeProperty)) {
                var theScope = element.data()[scopeProperty];
 
                if (typeof scopes[theScope.$id] == "undefined") {
                    scopes[theScope.$id] = true;
     
                    angular.forEach(theScope.$$watchers, function(watcher) {
                        watchers.push(watcher);
                        for (index = 0; index < element[0]['attributes'].length; ++index) {
                            if (is_not_duplicate(elements_per_attr[element[0]['attributes'][index].nodeName], theScope.$id)) {
                           
                                if (typeof elements[element[0]['attributes'][index].nodeName] == "undefined") {
                                    elements[element[0]['attributes'][index].nodeName] = [];
                                }
     
                                elements[element[0]['attributes'][index].nodeName].push({
                                        element: "(Scope " + theScope.$id + "): " + element[0].outerHTML,
                                        element_obj: element[0],
                                        element_data: element.data(),
                                        relevant_watcher: watcher,
                                        current_value: watcher.last
    	
                                    }
     
                                );
                                if (typeof elements_per_attr[element[0]['attributes'][index].nodeName] == "undefined") {
                                    elements_per_attr[element[0]['attributes'][index].nodeName] = [];
                                }
                                elements_per_attr[element[0]['attributes'][index].nodeName].push(theScope.$id);
                            }
                        }
                    });
                }
            }
        });
        //recur
        angular.forEach(element.children(), function(childElement) {
            f($(childElement));
        });
    };
 
    f(root);
    console.log("####################");
    console.log("Analysing Watchers");
    console.log("####################");
    console.log(" ");
    console.log("Watchers:");
    console.log(watchers.length);
    console.log("----------------------------------------------");
    console.log("Watched Elements grouped by attribute");
    console.log(elements);
})();

total-watchers.js

/**
 * get all watchers on the whole page
 * getWatchers();
 * 
 * get watchers of a specific element (and its children)
 * getWatchers(document.body);
 * 
 * select the element of interest in Chrome Dev tools
 * getWatchers($0);
 */ 
function getWatchers(root) {
  root = angular.element(root || document.documentElement);
  var watcherCount = 0;
 
  function getElemWatchers(element) {
    var isolateWatchers = getWatchersFromScope(element.data().$isolateScope);
    var scopeWatchers = getWatchersFromScope(element.data().$scope);
    var watchers = scopeWatchers.concat(isolateWatchers);
    angular.forEach(element.children(), function (childElement) {
      watchers = watchers.concat(getElemWatchers(angular.element(childElement)));
    });
    return watchers;
  }
  
  function getWatchersFromScope(scope) {
    if (scope) {
      return scope.$$watchers || [];
    } else {
      return [];
    }
  }
 
  return getElemWatchers(root);
}
getWatchers().length