feat($compile): allow disabling scope info

The compiler adds scope information (`ng-scope` CSS class and `$scope` data property) to elements
when the are bound to the scope. This is mostly to aid debugging tools such as Batarang. In
production this should be unnecesary and adds a performance penalty.

In the bench/apps/largetable-bp this change caused an improvement of ~100ms (7%).

This can be now disabled by calling `$compileProvider.debugInfoEnabled(false)`
in a module `config` block:
```
someModule.config(['$compileProvider', function($compileProvider) {
  $compileProvider.debugInfoEnabled(false);
}]);
```

In the bench/apps/largetable-bp benchmark this change, with debug info disabled,
improved by ~120ms, that is ~10%.
Measuring the "create" phase, 25 loops, mean time ~1200ms -> ~1080ms.

Author: petebacondarwin

src/ng/compile.js

@@ -886,6 +886,17 @@ function $CompileProvider($provide, $$sanitizeUriProvider) {
       }
     };
 
+
+    function safeAddClass($element, className) {
+      try {
+        $element.addClass(className);
+      } catch(e) {
+        // ignore, since it means that we are trying to set class on
+        // SVG element, where class name is read-only.
+      }
+    }
+
+
     var startSymbol = $interpolate.startSymbol(),
         endSymbol = $interpolate.endSymbol(),
         denormalizeTemplate = (startSymbol == '{{' || endSymbol  == '}}')
@@ -896,11 +907,14 @@ function $CompileProvider($provide, $$sanitizeUriProvider) {
         NG_ATTR_BINDING = /^ngAttr[A-Z]/;
 
     compile.$$addBindingInfo = debugInfoEnabled ? function $$addBindingInfo(element, binding) {
-      element
-          .addClass('ng-binding')
-          .data('$binding',
-              (element.data('$binding') || []).concat(binding.expressions || [binding])
-          );
+      safeAddClass(element, 'ng-binding');
+      element.data('$binding', (element.data('$binding') || []).concat(binding.expressions || [binding]));
+    } : noop;
+
+    compile.$$addScopeInfo = debugInfoEnabled ? function $$addScopeInfo(element, scope, isolated, noTemplate) {
+      safeAddClass(jqLite(element), isolated ? 'ng-isolate-scope' : 'ng-scope');
+      var dataName = isolated ? (noTemplate ? '$isolateScopeNoTemplate' : '$isolateScope') : '$scope';
+      element.data ? element.data(dataName, scope) : jqLite.data(element, dataName, scope);
     } : noop;
 
     return compile;
@@ -924,9 +938,9 @@ function $CompileProvider($provide, $$sanitizeUriProvider) {
       var compositeLinkFn =
               compileNodes($compileNodes, transcludeFn, $compileNodes,
                            maxPriority, ignoreDirective, previousCompileContext);
-      safeAddClass($compileNodes, 'ng-scope');
-      var namespace = null;
+
       return function publicLinkFn(scope, cloneConnectFn, transcludeControllers, parentBoundTranscludeFn, futureParentElement){
+        var namespace = null;
         assertArg(scope, 'scope');
         if (!namespace) {
           namespace = detectNamespaceForChildElements(futureParentElement);
@@ -949,7 +963,7 @@ function $CompileProvider($provide, $$sanitizeUriProvider) {
           }
         }
 
-        $linkNode.data('$scope', scope);
+        compile.$$addScopeInfo($linkNode, scope);
 
         if (cloneConnectFn) cloneConnectFn($linkNode, scope);
         if (compositeLinkFn) compositeLinkFn(scope, $linkNode, $linkNode, parentBoundTranscludeFn);
@@ -967,15 +981,6 @@ function $CompileProvider($provide, $$sanitizeUriProvider) {
       }
     }
 
-    function safeAddClass($element, className) {
-      try {
-        $element.addClass(className);
-      } catch(e) {
-        // ignore, since it means that we are trying to set class on
-        // SVG element, where class name is read-only.
-      }
-    }
-
     /**
      * Compile function matches each node in nodeList against the directives. Once all directives
      * for a particular node are collected their compile functions are executed. The compile
@@ -1008,10 +1013,6 @@ function $CompileProvider($provide, $$sanitizeUriProvider) {
                                       null, [], [], previousCompileContext)
             : null;
 
-        if (nodeLinkFn && nodeLinkFn.scope) {
-          safeAddClass(attrs.$$element, 'ng-scope');
-        }
-
         childLinkFn = (nodeLinkFn && nodeLinkFn.terminal ||
                       !(childNodes = nodeList[i].childNodes) ||
                       !childNodes.length)
@@ -1062,7 +1063,7 @@ function $CompileProvider($provide, $$sanitizeUriProvider) {
           if (nodeLinkFn) {
             if (nodeLinkFn.scope) {
               childScope = scope.$new();
-              jqLite.data(node, '$scope', childScope);
+              compile.$$addScopeInfo(node, childScope);
             } else {
               childScope = scope;
             }
@@ -1563,14 +1564,8 @@ function $CompileProvider($provide, $$sanitizeUriProvider) {
 
           isolateScope = scope.$new(true);
 
-          if (templateDirective && (templateDirective === newIsolateScopeDirective ||
-              templateDirective === newIsolateScopeDirective.$$originalDirective)) {
-            $element.data('$isolateScope', isolateScope);
-          } else {
-            $element.data('$isolateScopeNoTemplate', isolateScope);
-          }
-
-
+          compile.$$addScopeInfo($element, isolateScope, true, !(templateDirective && (templateDirective === newIsolateScopeDirective ||
+              templateDirective === newIsolateScopeDirective.$$originalDirective)));
 
           safeAddClass($element, 'ng-isolate-scope');
 

test/ng/compileSpec.js

@@ -4250,12 +4250,17 @@ describe('$compile', function() {
 
 
 
-      it('should not leak if two "element" transclusions are on the same element', function () {
+      it('should not leak if two "element" transclusions are on the same element (with debug info)', function () {
         if (jQuery) {
           // jQuery 2.x doesn't expose the cache storage.
           return;
         }
 
+
+        module(function($compileProvider) {
+          $compileProvider.debugInfoEnabled(true);
+        });
+
         inject(function($compile, $rootScope) {
           expect(jqLiteCacheSize()).toEqual(0);
 
@@ -4277,12 +4282,48 @@ describe('$compile', function() {
       });
 
 
-      it('should not leak if two "element" transclusions are on the same element', function () {
+      it('should not leak if two "element" transclusions are on the same element (without debug info)', function () {
         if (jQuery) {
           // jQuery 2.x doesn't expose the cache storage.
           return;
         }
 
+
+        module(function($compileProvider) {
+          $compileProvider.debugInfoEnabled(false);
+        });
+
+        inject(function($compile, $rootScope) {
+          expect(jqLiteCacheSize()).toEqual(0);
+
+          element = $compile('<div><div ng-repeat="x in xs" ng-if="x==1">{{x}}</div></div>')($rootScope);
+          expect(jqLiteCacheSize()).toEqual(0);
+
+          $rootScope.$apply('xs = [0,1]');
+          expect(jqLiteCacheSize()).toEqual(0);
+
+          $rootScope.$apply('xs = [0]');
+          expect(jqLiteCacheSize()).toEqual(0);
+
+          $rootScope.$apply('xs = []');
+          expect(jqLiteCacheSize()).toEqual(0);
+
+          element.remove();
+          expect(jqLiteCacheSize()).toEqual(0);
+        });
+      });
+
+
+      it('should not leak if two "element" transclusions are on the same element (with debug info)', function () {
+        if (jQuery) {
+          // jQuery 2.x doesn't expose the cache storage.
+          return;
+        }
+
+        module(function($compileProvider) {
+          $compileProvider.debugInfoEnabled(true);
+        });
+
         inject(function($compile, $rootScope) {
           expect(jqLiteCacheSize()).toEqual(0);
           element = $compile('<div><div ng-repeat="x in xs" ng-if="val">{{x}}</div></div>')($rootScope);
@@ -5220,7 +5261,9 @@ describe('$compile', function() {
           }));
         });
         inject(function($compile) {
-          element = $compile('<div transclude><div child></div></div>')($rootScope);
+          // We need to wrap the transclude directive's element in a parent element so that the
+          // cloned element gets deallocated/cleaned up correctly
+          element = $compile('<div><div transclude><div child></div></div></div>')($rootScope);
           expect(capturedTranscludeCtrl).toBeTruthy();
         });
       });