feat(benchmarks): add `polymer_leaves` benchmark

This commit is contained in:
Tobias Bosch 2016-08-30 13:44:52 -07:00
parent 873233e825
commit f7b5478e9f
5 changed files with 112 additions and 9 deletions

View File

@ -12,7 +12,7 @@ describe('tree benchmark', () => {
afterEach(verifyNoBrowserErrors); afterEach(verifyNoBrowserErrors);
it('should work for the baseline', function(done) { it('should work for the baseline', (done) => {
runBenchmark({ runBenchmark({
id: 'deepTree.baseline', id: 'deepTree.baseline',
url: 'all/benchmarks/src/tree/baseline/index.html', url: 'all/benchmarks/src/tree/baseline/index.html',
@ -25,7 +25,7 @@ describe('tree benchmark', () => {
}).then(done, done.fail); }).then(done, done.fail);
}); });
it('should work for ng2', function(done) { it('should work for ng2', (done) => {
runBenchmark({ runBenchmark({
id: 'deepTree.ng2', id: 'deepTree.ng2',
url: 'all/benchmarks/src/tree/ng2/index.html', url: 'all/benchmarks/src/tree/ng2/index.html',
@ -34,10 +34,10 @@ describe('tree benchmark', () => {
$('#createDom').click(); $('#createDom').click();
$('#destroyDom').click(); $('#destroyDom').click();
} }
}).then(done, done.fail) }).then(done, done.fail);
}); });
it('should work for polymer', function(done) { it('should work for polymer binary tree', (done) => {
runBenchmark({ runBenchmark({
id: 'deepTree.polymer', id: 'deepTree.polymer',
url: 'all/benchmarks/src/tree/polymer/index.html', url: 'all/benchmarks/src/tree/polymer/index.html',
@ -47,6 +47,19 @@ describe('tree benchmark', () => {
$('#createDom').click(); $('#createDom').click();
$('#destroyDom').click(); $('#destroyDom').click();
} }
}).then(done, done.fail) }).then(done, done.fail);
});
it('should work for polymer leaves', (done) => {
runBenchmark({
id: 'deepTree.polymerLeaves',
url: 'all/benchmarks/src/tree/polymer_leaves/index.html',
ignoreBrowserSynchronization: true,
params: [{name: 'depth', value: 9}],
work: () => {
$('#createDom').click();
$('#destroyDom').click();
}
}).then(done, done.fail);
}); });
}); });

View File

@ -10,11 +10,11 @@ import {openBrowser, verifyNoBrowserErrors} from 'e2e_util/e2e_util';
const useBundles = false; const useBundles = false;
describe('tree benchmark', function() { describe('tree benchmark', () => {
afterEach(verifyNoBrowserErrors); afterEach(verifyNoBrowserErrors);
it('should work for the baseline', function() { it('should work for the baseline', () => {
openBrowser({ openBrowser({
url: 'all/benchmarks/src/tree/baseline/index.html', url: 'all/benchmarks/src/tree/baseline/index.html',
ignoreBrowserSynchronization: true, ignoreBrowserSynchronization: true,
@ -23,7 +23,7 @@ describe('tree benchmark', function() {
expect($('baseline').getText()).toContain('0'); expect($('baseline').getText()).toContain('0');
}); });
it('should work for ng2', function() { it('should work for ng2', () => {
openBrowser({ openBrowser({
url: 'all/benchmarks/src/tree/ng2/index.html', url: 'all/benchmarks/src/tree/ng2/index.html',
}); });
@ -31,7 +31,7 @@ describe('tree benchmark', function() {
expect($('app').getText()).toContain('0'); expect($('app').getText()).toContain('0');
}); });
it('should work for polymer', function() { it('should work for polymer binary tree', () => {
openBrowser({ openBrowser({
url: 'all/benchmarks/src/tree/polymer/index.html', url: 'all/benchmarks/src/tree/polymer/index.html',
ignoreBrowserSynchronization: true, ignoreBrowserSynchronization: true,
@ -40,4 +40,13 @@ describe('tree benchmark', function() {
expect($('#app').getText()).toContain('0'); expect($('#app').getText()).toContain('0');
}); });
it('should work for polymer leaves', () => {
openBrowser({
url: 'all/benchmarks/src/tree/polymer_leaves/index.html',
ignoreBrowserSynchronization: true,
});
$('#createDom').click();
expect($('#app').getText()).toContain('0');
});
}); });

View File

@ -0,0 +1,29 @@
<!doctype html>
<html>
<head>
<link rel="import" href="tree_leaf.html">
</head>
<body>
<h2>Params</h2>
<form>
Depth:
<input type="number" name="depth" placeholder="depth" value="9">
<br>
<button>Apply</button>
</form>
<h2>Polymer tree benchmark</h2>
<p>
<button id="destroyDom">destroyDom</button>
<button id="createDom">createDom</button>
</p>
<div>
<binary-tree id="app"></binary-tree>
</div>
<script src="../../bootstrap.js"></script>
</body>
</html>

View File

@ -0,0 +1,38 @@
import {bindAction} from '@angular/platform-browser/testing/benchmark_util';
import {TreeNode, buildTree, emptyTree} from '../app/util';
declare var Polymer: any;
export function main() {
const rootEl: any = document.querySelector('binary-tree');
rootEl.data = emptyTree();
function destroyDom() {
while (rootEl.firstChild) rootEl.removeChild(rootEl.firstChild);
}
function createDom() {
const flatTree = flattenTree(buildTree(), []);
for (var i = 0; i < flatTree.length; i++) {
const el: any = document.createElement('tree-leaf');
el.value = flatTree[i];
rootEl.appendChild(el);
}
}
bindAction('#destroyDom', destroyDom);
bindAction('#createDom', createDom);
}
function flattenTree(node: TreeNode, target: string[]): string[] {
target.push(node.value);
if (node.left) {
flattenTree(node.left, target);
}
if (node.right) {
flattenTree(node.right, target);
}
return target;
}

View File

@ -0,0 +1,14 @@
<link rel="import" href="/all/benchmarks/vendor/polymer/polymer.html">
<dom-module id="tree-leaf">
<template>
<span>{{value}}</span>
</template>
<script>
Polymer({
is: 'tree-leaf',
properties: {
value: ''
}
});
</script>
</dom-module>