perf(benchmarks): benchmark measuring cost of decorators (fixes #1479)
This commit is contained in:
parent
6dece68bb8
commit
9fc9d53566
|
@ -102,7 +102,7 @@ export class BrowserDomAdapter extends GenericBrowserDomAdapter {
|
||||||
nodeValue(node:Node):string {
|
nodeValue(node:Node):string {
|
||||||
return node.nodeValue;
|
return node.nodeValue;
|
||||||
}
|
}
|
||||||
type(node:string) {
|
type(node:Node) {
|
||||||
return node.type;
|
return node.type;
|
||||||
}
|
}
|
||||||
content(node:HTMLElement):Node {
|
content(node:HTMLElement):Node {
|
||||||
|
|
|
@ -0,0 +1,31 @@
|
||||||
|
var perfUtil = require('angular2/src/test_lib/perf_util');
|
||||||
|
|
||||||
|
describe('ng2 cost benchmark', function () {
|
||||||
|
|
||||||
|
var URL = 'benchmarks/src/costs/index.html';
|
||||||
|
var benchmarkSize = 200;
|
||||||
|
|
||||||
|
afterEach(perfUtil.verifyNoBrowserErrors);
|
||||||
|
|
||||||
|
it('should log stats for baseline (plain components)', function(done) {
|
||||||
|
perfUtil.runClickBenchmark({
|
||||||
|
url: URL,
|
||||||
|
buttons: ['#reset', '#createPlainComponents'],
|
||||||
|
id: 'ng2.costs.baseline',
|
||||||
|
params: [{
|
||||||
|
name: 'size', value: 200, scale: 'linear'
|
||||||
|
}]
|
||||||
|
}).then(done, done.fail);
|
||||||
|
});
|
||||||
|
|
||||||
|
it('should log stats for components with decorators', function(done) {
|
||||||
|
perfUtil.runClickBenchmark({
|
||||||
|
url: URL,
|
||||||
|
buttons: ['#reset', '#createComponentsWithDecorators'],
|
||||||
|
id: 'ng2.costs.decorators',
|
||||||
|
params: [{
|
||||||
|
name: 'size', value: 200, scale: 'linear'
|
||||||
|
}]
|
||||||
|
}).then(done, done.fail);
|
||||||
|
});
|
||||||
|
});
|
|
@ -18,6 +18,7 @@ transformers:
|
||||||
- angular2:
|
- angular2:
|
||||||
entry_points:
|
entry_points:
|
||||||
- web/src/compiler/compiler_benchmark.dart
|
- web/src/compiler/compiler_benchmark.dart
|
||||||
|
- web/src/costs/index.dart
|
||||||
- web/src/di/di_benchmark.dart
|
- web/src/di/di_benchmark.dart
|
||||||
- web/src/element_injector/element_injector_benchmark.dart
|
- web/src/element_injector/element_injector_benchmark.dart
|
||||||
- web/src/largetable/largetable_benchmark.dart
|
- web/src/largetable/largetable_benchmark.dart
|
||||||
|
|
|
@ -0,0 +1,30 @@
|
||||||
|
<!doctype html>
|
||||||
|
<html>
|
||||||
|
<body>
|
||||||
|
|
||||||
|
<h2>Params</h2>
|
||||||
|
<form>
|
||||||
|
Size:
|
||||||
|
<input type="number" name="size" placeholder="size" value="100">
|
||||||
|
<br>
|
||||||
|
<button>Apply</button>
|
||||||
|
</form>
|
||||||
|
|
||||||
|
<h2>Benchmarks</h2>
|
||||||
|
<button id="reset">Reset</button>
|
||||||
|
<table>
|
||||||
|
<tr>
|
||||||
|
<td>Baseline (plain components)</td>
|
||||||
|
<td><button id="createPlainComponents">Run</button></td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>Cost of decorators</td>
|
||||||
|
<td><button id="createComponentsWithDecorators">Run</button></td>
|
||||||
|
</tr>
|
||||||
|
</table>
|
||||||
|
|
||||||
|
<app></app>
|
||||||
|
|
||||||
|
$SCRIPTS$
|
||||||
|
</body>
|
||||||
|
</html>
|
|
@ -0,0 +1,89 @@
|
||||||
|
import {
|
||||||
|
bootstrap,
|
||||||
|
Component,
|
||||||
|
Decorator,
|
||||||
|
View
|
||||||
|
} from 'angular2/angular2';
|
||||||
|
import {LifeCycle} from 'angular2/src/core/life_cycle/life_cycle';
|
||||||
|
import {List, ListWrapper} from 'angular2/src/facade/collection';
|
||||||
|
import {reflector} from 'angular2/src/reflection/reflection';
|
||||||
|
import {ReflectionCapabilities} from 'angular2/src/reflection/reflection_capabilities';
|
||||||
|
import {getIntParameter, bindAction} from 'angular2/src/test_lib/benchmark_util';
|
||||||
|
import {If, For} from 'angular2/directives';
|
||||||
|
|
||||||
|
var testList = null;
|
||||||
|
|
||||||
|
export function main() {
|
||||||
|
reflector.reflectionCapabilities = new ReflectionCapabilities();
|
||||||
|
var size = getIntParameter('size');
|
||||||
|
testList = ListWrapper.createFixedSize(size);
|
||||||
|
|
||||||
|
bootstrap(AppComponent).then((ref) => {
|
||||||
|
var injector = ref.injector;
|
||||||
|
var app:AppComponent = injector.get(AppComponent);
|
||||||
|
var lifeCycle = injector.get(LifeCycle);
|
||||||
|
|
||||||
|
bindAction('#reset', function() {
|
||||||
|
app.reset();
|
||||||
|
lifeCycle.tick();
|
||||||
|
});
|
||||||
|
|
||||||
|
// Baseline (plain components)
|
||||||
|
bindAction('#createPlainComponents', function() {
|
||||||
|
app.createPlainComponents();
|
||||||
|
lifeCycle.tick();
|
||||||
|
});
|
||||||
|
|
||||||
|
// Components with decorators
|
||||||
|
bindAction('#createComponentsWithDecorators', function() {
|
||||||
|
app.createComponentsWithDecorators();
|
||||||
|
lifeCycle.tick();
|
||||||
|
});
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
@Component({selector: 'app'})
|
||||||
|
@View({
|
||||||
|
directives: [If, For, DummyComponent, DummyDecorator],
|
||||||
|
template: `
|
||||||
|
<div *if="testingPlainComponents">
|
||||||
|
<dummy *for="#i of list"></dummy>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div *if="testingWithDecorators">
|
||||||
|
<dummy dummy-decorator *for="#i of list"></dummy>
|
||||||
|
</div>
|
||||||
|
`
|
||||||
|
})
|
||||||
|
class AppComponent {
|
||||||
|
list:List;
|
||||||
|
testingPlainComponents:boolean;
|
||||||
|
testingWithDecorators:boolean;
|
||||||
|
|
||||||
|
constructor() {
|
||||||
|
this.reset();
|
||||||
|
}
|
||||||
|
|
||||||
|
reset():void {
|
||||||
|
this.list = [];
|
||||||
|
this.testingPlainComponents = false;
|
||||||
|
this.testingWithDecorators = false;
|
||||||
|
}
|
||||||
|
|
||||||
|
createPlainComponents():void {
|
||||||
|
this.list = testList;
|
||||||
|
this.testingPlainComponents = true;
|
||||||
|
}
|
||||||
|
|
||||||
|
createComponentsWithDecorators():void {
|
||||||
|
this.list = testList;
|
||||||
|
this.testingWithDecorators = true;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@Component({selector: 'dummy'})
|
||||||
|
@View({template: `<div></div>`})
|
||||||
|
class DummyComponent {}
|
||||||
|
|
||||||
|
@Decorator({selector: '[dummy-decorator]'})
|
||||||
|
class DummyDecorator {}
|
|
@ -26,6 +26,9 @@
|
||||||
<li>
|
<li>
|
||||||
<a href="largetable/largetable_benchmark.html">Largetable benchmark</a>
|
<a href="largetable/largetable_benchmark.html">Largetable benchmark</a>
|
||||||
</li>
|
</li>
|
||||||
|
<li>
|
||||||
|
<a href="costs/index.html">Benchmarks measuring costs of things</a>
|
||||||
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|
Loading…
Reference in New Issue