perf: Change baseline benchmark to be more consistent with the Angular

This commit is contained in:
Misko Hevery 2015-01-12 21:56:11 -08:00
parent e4a4ec840e
commit bed4b52a63
1 changed files with 13 additions and 10 deletions

View File

@ -41,8 +41,8 @@ function setupReflector() {
directives: [TreeComponent, NgIf], directives: [TreeComponent, NgIf],
inline: ` inline: `
<span> {{data.value}} <span> {{data.value}}
<span template='ng-if data.left != null'><tree [data]='data.left'></tree></span>
<span template='ng-if data.right != null'><tree [data]='data.right'></tree></span> <span template='ng-if data.right != null'><tree [data]='data.right'></tree></span>
<span template='ng-if data.left != null'><tree [data]='data.left'></tree></span>
</span>` </span>`
}) })
})] })]
@ -188,8 +188,9 @@ export function main() {
} }
function initBaseline() { function initBaseline() {
baselineRootTreeComponent = new BaseLineTreeComponent(); var tree = DOM.createElement('tree');
DOM.appendChild(DOM.querySelector(document, 'baseline'), baselineRootTreeComponent.element); DOM.appendChild(DOM.querySelector(document, 'baseline'), tree);
baselineRootTreeComponent = new BaseLineTreeComponent(tree);
DOM.on(DOM.querySelector(document, '#baselineDestroyDom'), 'click', baselineDestroyDom); DOM.on(DOM.querySelector(document, '#baselineDestroyDom'), 'click', baselineDestroyDom);
DOM.on(DOM.querySelector(document, '#baselineCreateDom'), 'click', baselineCreateDom); DOM.on(DOM.querySelector(document, '#baselineCreateDom'), 'click', baselineCreateDom);
DOM.on(DOM.querySelector(document, '#baselineUpdateDomProfile'), 'click', profile(baselineCreateDom, noop, 'baseline-update')); DOM.on(DOM.querySelector(document, '#baselineUpdateDomProfile'), 'click', profile(baselineCreateDom, noop, 'baseline-update'));
@ -219,18 +220,19 @@ function buildTree(maxDepth, values, curDepth) {
buildTree(maxDepth, values, curDepth+1)); buildTree(maxDepth, values, curDepth+1));
} }
var BASELINE_TEMPLATE = DOM.createTemplate( var BASELINE_TREE_TEMPLATE = DOM.createTemplate(
'<span>_<template class="ng-binding"></template><template class="ng-binding"></template></span>'); '<span>_<template class="ng-binding"></template><template class="ng-binding"></template></span>');
var BASELINE_IF_TEMPLATE = DOM.createTemplate(
'<span template="ng-if"><tree></tree></span>');
// http://jsperf.com/nextsibling-vs-childnodes // http://jsperf.com/nextsibling-vs-childnodes
class BaseLineTreeComponent { class BaseLineTreeComponent {
element:Element;
value:BaseLineInterpolation; value:BaseLineInterpolation;
left:BaseLineIf; left:BaseLineIf;
right:BaseLineIf; right:BaseLineIf;
constructor() { constructor(element) {
this.element = DOM.createElement('span'); this.element = element;
var clone = DOM.clone(BASELINE_TEMPLATE.content.firstChild); var clone = DOM.clone(BASELINE_TREE_TEMPLATE.content.firstChild);
var shadowRoot = this.element.createShadowRoot(); var shadowRoot = this.element.createShadowRoot();
DOM.appendChild(shadowRoot, clone); DOM.appendChild(shadowRoot, clone);
@ -281,8 +283,9 @@ class BaseLineIf {
this.component = null; this.component = null;
} }
if (this.condition) { if (this.condition) {
this.component = new BaseLineTreeComponent(); var element = DOM.clone(BASELINE_IF_TEMPLATE).content.firstChild;
this.anchor.parentNode.insertBefore(this.component.element, this.anchor); this.anchor.parentNode.insertBefore(element, this.anchor.nextSibling);
this.component = new BaseLineTreeComponent(element.firstChild);
} }
} }
if (isPresent(this.component)) { if (isPresent(this.component)) {