perf(render): precompute # bound text nodes and root nodes in DomProtoView

tbosch · tbosch · commit 24e647e0f75e · 2015-06-11T14:45:44.000-07:00
diff --git a/modules/angular2/src/dom/html_adapter.dart b/modules/angular2/src/dom/html_adapter.dart
@@ -102,7 +102,7 @@ class Html5LibDomAdapter implements DomAdapter {
     throw 'not implemented';
   }
   content(node) {
-    throw 'not implemented';
+    return node;
   }
 
   firstChild(el) => el is NodeList ? el.first : el.firstChild;
diff --git a/modules/angular2/src/render/dom/dom_renderer.ts b/modules/angular2/src/render/dom/dom_renderer.ts
@@ -224,13 +224,11 @@ export class DomRenderer extends Renderer {
       rootElementClone = DOM.importIntoDoc(DOM.content(protoView.element));
       elementsWithBindingsDynamic =
           DOM.querySelectorAll(rootElementClone, NG_BINDING_CLASS_SELECTOR);
-      var childNode = DOM.firstChild(rootElementClone);
-      // TODO(perf): Should be fixed size, since we could pre-compute in in DomProtoView
-      viewRootNodes = [];
+      viewRootNodes = ListWrapper.createFixedSize(protoView.rootNodeCount);
       // Note: An explicit loop is the fastest way to convert a DOM array into a JS array!
-      while (childNode != null) {
-        ListWrapper.push(viewRootNodes, childNode);
-        childNode = DOM.nextSibling(childNode);
+      var childNode = DOM.firstChild(rootElementClone);
+      for (var i = 0; i < protoView.rootNodeCount; i++, childNode = DOM.nextSibling(childNode)) {
+        viewRootNodes[i] = childNode;
       }
     } else {
       rootElementClone = DOM.importIntoDoc(protoView.element);
@@ -239,8 +237,9 @@ export class DomRenderer extends Renderer {
     }
 
     var binders = protoView.elementBinders;
-    var boundTextNodes = [];
+    var boundTextNodes = ListWrapper.createFixedSize(protoView.boundTextNodeCount);
     var boundElements = ListWrapper.createFixedSize(binders.length);
+    var boundTextNodeIdx = 0;
 
     for (var binderIdx = 0; binderIdx < binders.length; binderIdx++) {
       var binder = binders[binderIdx];
@@ -261,7 +260,7 @@ export class DomRenderer extends Renderer {
       // boundTextNodes
       var textNodeIndices = binder.textNodeIndices;
       for (var i = 0; i < textNodeIndices.length; i++) {
-        ListWrapper.push(boundTextNodes, childNodes[textNodeIndices[i]]);
+        boundTextNodes[boundTextNodeIdx++] = childNodes[textNodeIndices[i]];
       }
 
       // contentTags
diff --git a/modules/angular2/src/render/dom/view/proto_view.ts b/modules/angular2/src/render/dom/view/proto_view.ts
@@ -1,7 +1,7 @@
 import {isPresent} from 'angular2/src/facade/lang';
 import {DOM} from 'angular2/src/dom/dom_adapter';
 
-import {List} from 'angular2/src/facade/collection';
+import {List, ListWrapper} from 'angular2/src/facade/collection';
 
 import {ElementBinder} from './element_binder';
 import {NG_BINDING_CLASS} from '../util';
@@ -27,6 +27,8 @@ export class DomProtoView {
   rootBindingOffset: number;
   // the number of content tags seen in this or any child proto view.
   transitiveContentTagCount: number;
+  boundTextNodeCount: number;
+  rootNodeCount: number;
 
   constructor({elementBinders, element, transitiveContentTagCount}) {
     this.element = element;
@@ -35,5 +37,11 @@ export class DomProtoView {
     this.isTemplateElement = DOM.isTemplateElement(this.element);
     this.rootBindingOffset =
         (isPresent(this.element) && DOM.hasClass(this.element, NG_BINDING_CLASS)) ? 1 : 0;
+    this.boundTextNodeCount =
+        ListWrapper.reduce(elementBinders, (prevCount: number, elementBinder: ElementBinder) =>
+                                                   prevCount + elementBinder.textNodeIndices.length,
+                           0);
+    this.rootNodeCount =
+        this.isTemplateElement ? DOM.childNodes(DOM.content(this.element)).length : 1;
   }
 }

Original file line number	Diff line number	Diff line change
`@@ -102,7 +102,7 @@ class Html5LibDomAdapter implements DomAdapter {`
`102`	`102`	`throw 'not implemented';`
`103`	`103`	`}`
`104`	`104`	`content(node) {`
`105`		`- throw 'not implemented';`
	`105`	`+ return node;`
`106`	`106`	`}`
`107`	`107`
`108`	`108`	`firstChild(el) => el is NodeList ? el.first : el.firstChild;`