refactor(perf): use webdriver to execute benchmarks
- use performance log of chromedriver / appium to get timeline data for calculating metrics for benchmarks - change all benchmarks to be made of a standalone application and a protractor test that collectes timeline data - fix and simplify benchmarks - add dart2js to build - remove benchpress Closes #330
This commit is contained in:
@ -1,7 +0,0 @@
|
||||
library tree_benchmark;
|
||||
|
||||
import './tree_benchmark_ng10.dart' as bm;
|
||||
|
||||
main () {
|
||||
bm.main();
|
||||
}
|
@ -1 +0,0 @@
|
||||
export {main} from './tree_benchmark_ng13';
|
@ -1,3 +0,0 @@
|
||||
$SCRIPTS$
|
||||
|
||||
<tree data="initData"></tree>
|
@ -1,8 +1,8 @@
|
||||
// tree benchmark in AngularDart 1.x
|
||||
library tree_benchmark_ng10;
|
||||
|
||||
import 'package:angular/angular.dart';
|
||||
import 'package:angular/application_factory.dart';
|
||||
import 'package:benchpress/benchpress.dart';
|
||||
import 'dart:html';
|
||||
|
||||
var MAX_DEPTH = 9;
|
||||
@ -23,28 +23,26 @@ main() {
|
||||
final injector = setup();
|
||||
final zone = injector.get(VmTurnZone);
|
||||
final rootScope = injector.get(Scope);
|
||||
var count = 0;
|
||||
|
||||
benchmark("tree benchmark", () {
|
||||
var count = 0;
|
||||
|
||||
benchmarkStep("AngularDart destroyDom binary tree of depth ${MAX_DEPTH}", () {
|
||||
zone.run(() {
|
||||
rootScope.context['initData'] = new TreeNode('');
|
||||
});
|
||||
destroyDom(_) {
|
||||
zone.run(() {
|
||||
rootScope.context['initData'] = new TreeNode('');
|
||||
});
|
||||
}
|
||||
|
||||
benchmarkStep("AngularDart createDom binary tree of depth ${MAX_DEPTH}", () {
|
||||
zone.run(() {
|
||||
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', '-'];
|
||||
createDom(_) {
|
||||
zone.run(() {
|
||||
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', '-'];
|
||||
|
||||
rootScope.context['initData'] = buildTree(maxDepth, values, 0);
|
||||
});
|
||||
rootScope.context['initData'] = buildTree(MAX_DEPTH, values, 0);
|
||||
});
|
||||
}
|
||||
|
||||
});
|
||||
document.querySelector('#destroyDom').addEventListener('click', destroyDom);
|
||||
document.querySelector('#createDom').addEventListener('click', createDom);
|
||||
}
|
||||
|
||||
@Component(
|
102
modules/benchmarks_external/src/tree/tree_benchmark.es6
Normal file
102
modules/benchmarks_external/src/tree/tree_benchmark.es6
Normal file
@ -0,0 +1,102 @@
|
||||
// tree benchmark in AngularJS 1.x
|
||||
var MAX_DEPTH = 9;
|
||||
|
||||
export function main() {
|
||||
angular.bootstrap(document.body, ['app']);
|
||||
}
|
||||
|
||||
angular.module('app', [])
|
||||
.directive('tree', function() {
|
||||
return {
|
||||
scope: {
|
||||
data: '='
|
||||
},
|
||||
template:
|
||||
'<span> {{data.value}}'+
|
||||
' <span tree-if="data.left"></span>'+
|
||||
' <span tree-if="data.right"></span>'+
|
||||
'</span>'
|
||||
};
|
||||
})
|
||||
// special directive for "if" as angular 1.3 does not support
|
||||
// recursive components.
|
||||
.directive('treeIf', ['$compile', '$parse', function($compile, $parse) {
|
||||
var transcludeFn;
|
||||
return {
|
||||
compile: function(element, attrs) {
|
||||
var expr = $parse(attrs.treeIf);
|
||||
var template = '<tree data="'+attrs.treeIf+'"></tree>';
|
||||
var transclude;
|
||||
return function($scope, $element, $attrs) {
|
||||
if (!transclude) {
|
||||
transclude = $compile(template);
|
||||
}
|
||||
var childScope;
|
||||
var childElement;
|
||||
$scope.$watch(expr, function(newValue) {
|
||||
if (childScope) {
|
||||
childScope.$destroy();
|
||||
childElement.remove();
|
||||
childScope = null;
|
||||
childElement = null;
|
||||
}
|
||||
if (newValue) {
|
||||
childScope = $scope.$new();
|
||||
childElement = transclude(childScope, function(clone) {
|
||||
$element.append(clone);
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
}])
|
||||
.config(['$compileProvider', function($compileProvider) {
|
||||
$compileProvider.debugInfoEnabled(false);
|
||||
}])
|
||||
.run(['$rootScope', function($rootScope) {
|
||||
var count = 0;
|
||||
|
||||
document.querySelector('#destroyDom').addEventListener('click', destroyDom, false);
|
||||
document.querySelector('#createDom').addEventListener('click', createDom, false);
|
||||
|
||||
function destroyDom(_) {
|
||||
$rootScope.$apply(function() {
|
||||
$rootScope.initData = new TreeNode('', null, null);
|
||||
});
|
||||
}
|
||||
|
||||
function createDom(_) {
|
||||
var maxDepth = MAX_DEPTH;
|
||||
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', '-'];
|
||||
|
||||
$rootScope.$apply(function() {
|
||||
$rootScope.initData = buildTree(MAX_DEPTH, values, 0);
|
||||
});
|
||||
}
|
||||
}]);
|
||||
|
||||
class TreeNode {
|
||||
value:string;
|
||||
left:TreeNode;
|
||||
right:TreeNode;
|
||||
constructor(value, left, right) {
|
||||
this.value = value;
|
||||
this.left = left;
|
||||
this.right = right;
|
||||
}
|
||||
}
|
||||
|
||||
function buildTree(maxDepth, values, curDepth) {
|
||||
if (maxDepth === curDepth) return new TreeNode('', null, null);
|
||||
return new TreeNode(
|
||||
values[curDepth],
|
||||
buildTree(maxDepth, values, curDepth+1),
|
||||
buildTree(maxDepth, values, curDepth+1));
|
||||
}
|
||||
|
||||
|
||||
|
17
modules/benchmarks_external/src/tree/tree_benchmark.html
Normal file
17
modules/benchmarks_external/src/tree/tree_benchmark.html
Normal file
@ -0,0 +1,17 @@
|
||||
<!doctype html>
|
||||
<html>
|
||||
<body>
|
||||
|
||||
<h2>AngularJS/Dart 1.x tree benchmark</h2>
|
||||
<p>
|
||||
<button id="destroyDom">destroyDom</button>
|
||||
<button id="createDom">createDom</button>
|
||||
</p>
|
||||
|
||||
<div>
|
||||
<tree data="initData"></tree>
|
||||
</div>
|
||||
|
||||
$SCRIPTS$
|
||||
</body>
|
||||
</html>
|
@ -1,112 +0,0 @@
|
||||
import {benchmark, benchmarkStep} from 'benchpress/benchpress';
|
||||
|
||||
var MAX_DEPTH = 9;
|
||||
|
||||
function setup() {
|
||||
var $rootScope;
|
||||
|
||||
angular.module('app', [])
|
||||
.directive('tree', function() {
|
||||
return {
|
||||
scope: {
|
||||
data: '='
|
||||
},
|
||||
template:
|
||||
'<span> {{data.value}}'+
|
||||
' <span tree-if="data.left"></span>'+
|
||||
' <span tree-if="data.right"></span>'+
|
||||
'</span>'
|
||||
};
|
||||
})
|
||||
// special directive for "if" as angular 1.3 does not support
|
||||
// recursive components.
|
||||
.directive('treeIf', ['$compile', '$parse', function($compile, $parse) {
|
||||
var transcludeFn;
|
||||
return {
|
||||
compile: function(element, attrs) {
|
||||
var expr = $parse(attrs.treeIf);
|
||||
var template = '<tree data="'+attrs.treeIf+'"></tree>';
|
||||
var transclude;
|
||||
return function($scope, $element, $attrs) {
|
||||
if (!transclude) {
|
||||
transclude = $compile(template);
|
||||
}
|
||||
var childScope;
|
||||
var childElement;
|
||||
$scope.$watch(expr, function(newValue) {
|
||||
if (childScope) {
|
||||
childScope.$destroy();
|
||||
childElement.remove();
|
||||
childScope = null;
|
||||
childElement = null;
|
||||
}
|
||||
if (newValue) {
|
||||
childScope = $scope.$new();
|
||||
childElement = transclude(childScope, function(clone) {
|
||||
$element.append(clone);
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
}])
|
||||
.config(['$compileProvider', function($compileProvider) {
|
||||
$compileProvider.debugInfoEnabled(false);
|
||||
}])
|
||||
.run(['$rootScope', function(_$rootScope_) {
|
||||
$rootScope = _$rootScope_;
|
||||
}])
|
||||
angular.bootstrap(document.body, ['app']);
|
||||
return $rootScope;
|
||||
}
|
||||
|
||||
export function main() {
|
||||
var $rootScope = setup();
|
||||
|
||||
benchmark(`tree benchmark`, function() {
|
||||
var count = 0;
|
||||
|
||||
benchmarkStep(`AngularJS destroyDom binary tree of depth ${MAX_DEPTH}`, function() {
|
||||
$rootScope.$apply(function() {
|
||||
$rootScope.initData = new TreeNode('', null, null);
|
||||
});
|
||||
});
|
||||
|
||||
benchmarkStep(`AngularJS 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', '-'];
|
||||
|
||||
$rootScope.$apply(function() {
|
||||
$rootScope.initData = buildTree(maxDepth, values, 0);
|
||||
});
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
class TreeNode {
|
||||
value:string;
|
||||
left:TreeNode;
|
||||
right:TreeNode;
|
||||
constructor(value, left, right) {
|
||||
this.value = value;
|
||||
this.left = left;
|
||||
this.right = right;
|
||||
}
|
||||
}
|
||||
|
||||
function buildTree(maxDepth, values, curDepth) {
|
||||
if (maxDepth === curDepth) return new TreeNode('', null, null);
|
||||
return new TreeNode(
|
||||
values[curDepth],
|
||||
buildTree(maxDepth, values, curDepth+1),
|
||||
buildTree(maxDepth, values, curDepth+1));
|
||||
}
|
||||
|
||||
|
||||
|
Reference in New Issue
Block a user