diff --git a/modules/benchmarks/src/tree/main.html b/modules/benchmarks/src/tree/main.html
index 901c3dbe1f..dd294aa7ef 100644
--- a/modules/benchmarks/src/tree/main.html
+++ b/modules/benchmarks/src/tree/main.html
@@ -1,3 +1,5 @@
$SCRIPTS$
-
\ No newline at end of file
+
+
+
\ No newline at end of file
diff --git a/modules/benchmarks/src/tree/tree_benchmark.js b/modules/benchmarks/src/tree/tree_benchmark.js
index 8f416072d0..b4284df5ff 100644
--- a/modules/benchmarks/src/tree/tree_benchmark.js
+++ b/modules/benchmarks/src/tree/tree_benchmark.js
@@ -11,6 +11,8 @@ import {DirectiveMetadataReader} from 'core/compiler/directive_metadata_reader';
import {TemplateLoader} from 'core/compiler/template_loader';
import {reflector} from 'reflection/reflection';
+import {DOM, document, Element} from 'facade/dom';
+import {isPresent} from 'facade/lang';
var MAX_DEPTH = 9;
@@ -146,6 +148,28 @@ export function main() {
});
});
+
+ benchmark(`baseline tree benchmark`, function() {
+ var baselineAppElement = DOM.querySelectorAll(document, 'baseline')[0];
+ var rootTreeComponent = new BaseLineTreeComponent();
+ DOM.appendChild(baselineAppElement, rootTreeComponent.element);
+
+ var count = 0;
+
+ benchmarkStep(`destroyDom binary tree of depth ${MAX_DEPTH}`, function() {
+ rootTreeComponent.update(new TreeNode('', null, null));
+ });
+
+ benchmarkStep(`createDom binary tree of depth ${MAX_DEPTH}`, function() {
+ var maxDepth = 9;
+ var values = count++ % 2 == 0 ?
+ ['0', '1', '2', '3', '4', '5', '6', '7', '8', '9', '*'] :
+ ['A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'I', 'J', '-'];
+
+ rootTreeComponent.update(buildTree(maxDepth, values, 0));
+ });
+
+ });
}
class TreeNode {
@@ -167,6 +191,78 @@ function buildTree(maxDepth, values, curDepth) {
buildTree(maxDepth, values, curDepth+1));
}
+var BASELINE_TEMPLATE = DOM.createTemplate(`
+ {{}}
+
+
+ `);
+
+
+class BaseLineTreeComponent {
+ element:Element;
+ value:BaseLineInterpolation;
+ left:BaseLineIf;
+ right:BaseLineIf;
+ constructor() {
+ this.element = DOM.createElement('span');
+ var clone = DOM.clone(BASELINE_TEMPLATE.content.children[0]);
+ var shadowRoot = this.element.createShadowRoot();
+ DOM.appendChild(shadowRoot, clone);
+
+ this.value = new BaseLineInterpolation(clone.childNodes[0]);
+ this.left = new BaseLineIf(clone.children[0]);
+ this.right = new BaseLineIf(clone.children[1]);
+ }
+ update(value:TreeNode) {
+ this.value.update(value.value);
+ this.left.update(value.left);
+ this.right.update(value.right);
+ }
+}
+
+class BaseLineInterpolation {
+ value:string;
+ textNode;
+ constructor(textNode) {
+ this.value = null;
+ this.textNode = textNode;
+ }
+ update(value:string) {
+ if (this.value !== value) {
+ this.value = value;
+ DOM.setText(this.textNode, value + ' ');
+ }
+ }
+}
+
+class BaseLineIf {
+ condition:boolean;
+ component:BaseLineTreeComponent;
+ anchor:Element;
+ constructor(anchor) {
+ this.anchor = anchor;
+ this.condition = false;
+ this.component = null;
+ }
+ update(value:TreeNode) {
+ var newCondition = isPresent(value);
+ if (this.condition !== newCondition) {
+ this.condition = newCondition;
+ if (isPresent(this.component)) {
+ this.component.element.remove();
+ this.component = null;
+ }
+ if (this.condition) {
+ this.component = new BaseLineTreeComponent();
+ this.anchor.parentNode.insertBefore(this.component.element, this.anchor);
+ }
+ }
+ if (isPresent(this.component)) {
+ this.component.update(value);
+ }
+ }
+}
+
class AppComponent {
initData:TreeNode;
constructor() {