perf($compile): add debug classes in compile phase

In a93f03d and d37f103 we changed the compiler and ngBind to add debugging CSS classes (i.e. ng-scope, ng-binding) in linking function. This simplified the code and made sense under the original assumptions that the debug info will be disabled by default. That is however not the case - debug info is enabled by default.

When debug info is enabled, this change improves the largetable-bp
benchmark by ~580ms, that is 30% faster.
Measuring the “create” phase, 25 loops, meantime ~1920ms -> ~1340ms.

This change does not affect performance when debug info is disabled.

Author: vojtajina

src/ng/compile.js

@@ -915,16 +915,22 @@ function $CompileProvider($provide, $$sanitizeUriProvider) {
         bindings.push(binding);
       }
 
-      safeAddClass($element, 'ng-binding');
       $element.data('$binding', bindings);
     } : noop;
 
+    compile.$$addBindingClass = debugInfoEnabled ? function $$addBindingClass($element) {
+      safeAddClass($element, 'ng-binding');
+    } : noop;
+
     compile.$$addScopeInfo = debugInfoEnabled ? function $$addScopeInfo($element, scope, isolated, noTemplate) {
-      safeAddClass($element, isolated ? 'ng-isolate-scope' : 'ng-scope');
       var dataName = isolated ? (noTemplate ? '$isolateScopeNoTemplate' : '$isolateScope') : '$scope';
       $element.data(dataName, scope);
     } : noop;
 
+    compile.$$addScopeClass = debugInfoEnabled ? function $$addScopeClass($element, isolated) {
+      safeAddClass($element, isolated ? 'ng-isolate-scope' : 'ng-scope');
+    } : noop;
+
     return compile;
 
     //================================
@@ -947,6 +953,8 @@ function $CompileProvider($provide, $$sanitizeUriProvider) {
               compileNodes($compileNodes, transcludeFn, $compileNodes,
                            maxPriority, ignoreDirective, previousCompileContext);
 
+      compile.$$addScopeClass($compileNodes);
+
       return function publicLinkFn(scope, cloneConnectFn, transcludeControllers, parentBoundTranscludeFn, futureParentElement){
         var namespace = null;
         assertArg(scope, 'scope');
@@ -1021,6 +1029,10 @@ function $CompileProvider($provide, $$sanitizeUriProvider) {
                                       null, [], [], previousCompileContext)
             : null;
 
+        if (nodeLinkFn && nodeLinkFn.scope) {
+          compile.$$addScopeClass(attrs.$$element);
+        }
+
         childLinkFn = (nodeLinkFn && nodeLinkFn.terminal ||
                       !(childNodes = nodeList[i].childNodes) ||
                       !childNodes.length)
@@ -1574,8 +1586,7 @@ function $CompileProvider($provide, $$sanitizeUriProvider) {
 
           compile.$$addScopeInfo($element, isolateScope, true, !(templateDirective && (templateDirective === newIsolateScopeDirective ||
               templateDirective === newIsolateScopeDirective.$$originalDirective)));
-
-          safeAddClass($element, 'ng-isolate-scope');
+          compile.$$addScopeClass($element, true);
 
           forEach(newIsolateScopeDirective.scope, function(definition, scopeName) {
             var match = definition.match(LOCAL_REGEXP) || [],
@@ -1985,8 +1996,16 @@ function $CompileProvider($provide, $$sanitizeUriProvider) {
         directives.push({
           priority: 0,
           compile: function textInterpolateCompileFn(templateNode) {
+            var templateNodeParent = templateNode.parent(),
+                hasCompileParent = !!templateNodeParent.length;
+
+            // When transcluding a template that has bindings in the root
+            // we don't have a parent and thus need to add the class during linking fn.
+            if (hasCompileParent) compile.$$addBindingClass(templateNodeParent);
+
             return function textInterpolateLinkFn(scope, node) {
               var parent = node.parent();
+              if (!hasCompileParent) compile.$$addBindingClass(parent);
               compile.$$addBindingInfo(parent, interpolateFn.expressions);
               scope.$watch(interpolateFn, function interpolateFnWatchAction(value) {
                 node[0].nodeValue = value;

src/ng/directive/ngBind.js

@@ -55,6 +55,7 @@ var ngBindDirective = ['$compile', function($compile) {
   return {
     restrict: 'AC',
     compile: function(templateElement) {
+      $compile.$$addBindingClass(templateElement);
       return function (scope, element, attr) {
         $compile.$$addBindingInfo(element, attr.ngBind);
         scope.$watch(attr.ngBind, function ngBindWatchAction(value) {
@@ -121,13 +122,18 @@ var ngBindDirective = ['$compile', function($compile) {
    </example>
  */
 var ngBindTemplateDirective = ['$interpolate', '$compile', function($interpolate, $compile) {
-  return function(scope, element, attr) {
-    var interpolateFn = $interpolate(element.attr(attr.$attr.ngBindTemplate));
-    $compile.$$addBindingInfo(element, interpolateFn.expressions);
-    attr.$observe('ngBindTemplate', function(value) {
-      element.text(value);
-    });
-  };
+  return {
+    compile: function(templateElement) {
+      $compile.$$addBindingClass(templateElement);
+      return function(scope, element, attr) {
+        var interpolateFn = $interpolate(element.attr(attr.$attr.ngBindTemplate));
+        $compile.$$addBindingInfo(element, interpolateFn.expressions);
+        attr.$observe('ngBindTemplate', function(value) {
+          element.text(value);
+        });
+      };
+    }
+  }
 }];
 
 
@@ -180,6 +186,7 @@ var ngBindHtmlDirective = ['$sce', '$parse', '$compile', function($sce, $parse,
   return {
     restrict: 'A',
     compile: function (tElement, tAttrs) {
+      $compile.$$addBindingClass(tElement);
 
       return function (scope, element, attr) {
         $compile.$$addBindingInfo(element, attr.ngBindHtml);