cargdev/angular
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

perf(ivy): introduce new benchmark for view create, destroy, traverse (#31797)

Browse Source 
PR Close #31797
This commit is contained in:
Pawel Kozlowski 2019-07-19 09:34:43 +02:00 committed by Miško Hevery
parent c7542a1d09
commit 85d051f8d5
4 changed files with 171 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

52
modules/benchmarks/src/views/BUILD.bazel Normal file
View File

@ -0,0 +1,52 @@
package(default_visibility = ["//modules/benchmarks:__subpackages__"])
load("//tools:defaults.bzl", "ng_module", "ng_rollup_bundle")
load("@npm_bazel_typescript//:index.bzl", "ts_devserver")
ng_module(
name = "application_lib",
srcs = glob(
["**/*.ts"],
exclude = ["**/*.spec.ts"],
),
deps = [
"//packages:types",
"//packages/common",
"//packages/core",
"//packages/platform-browser",
],
)
ng_rollup_bundle(
name = "bundle",
entry_point = ":index.ts",
deps = [
":application_lib",
],
)
ts_devserver(
name = "prodserver",
static_files = [
":bundle.min_debug.es2015.js",
":bundle.min.es2015.js",
"@npm//:node_modules/zone.js/dist/zone.js",
"index.html",
],
)
ts_devserver(
name = "devserver",
entry_module = "angular/modules/benchmarks/src/views/index",
index_html = "index.html",
scripts = [
"@npm//:node_modules/tslib/tslib.js",
"//tools/rxjs:rxjs_umd_modules",
],
serving_path = "/index.js",
static_files = [
"@npm//:node_modules/zone.js/dist/zone.js",
"index.html",
],
deps = [":application_lib"],
)

38
modules/benchmarks/src/views/index.html Normal file
View File

@ -0,0 +1,38 @@
<!doctype html>
<html>
<head>
<!-- Prevent the browser from requesting any favicon. -->
<link rel="icon" href="data:,">
</head>
<body>
<h1>Views traversal benchmark</h1>
<benchmark-root>loading...</benchmark-root>
<script>
addEventListener('DOMContentLoaded', () => {
// DevServer has automatic bootstrap code, so if we already have <scripts> than we don't need to bootstrap
var alreadyBootstrapped = document.querySelectorAll('script').length > 1; // 1 for ourselves
if (!alreadyBootstrapped) {
function loadScript(url) {
return new Promise(function (resolve, reject) {
var script = document.createElement('script');
script.src = url;
script.onload = resolve;
script.onerror = reject;
document.body.append(script);
});
}
// zone.js must be loaded and processed before Angular bundle gets executed
loadScript('/npm/node_modules/zone.js/dist/zone.js').then(function () {
loadScript(document.location.search.endsWith('debug') ? 'bundle.min_debug.es2015.js' : 'bundle.min.es2015.js');
});
}
});
</script>
</body>
</html>

14
modules/benchmarks/src/views/index.ts Normal file
View File

@ -0,0 +1,14 @@
/**
* @license
* Copyright Google Inc. All Rights Reserved.
*
* Use of this source code is governed by an MIT-style license that can be
* found in the LICENSE file at https://angular.io/license
*/
import {enableProdMode} from '@angular/core';
import {platformBrowser} from '@angular/platform-browser';
import {ViewsBenchmarkModuleNgFactory} from './views-benchmark.ngfactory';
enableProdMode();
platformBrowser().bootstrapModuleFactory(ViewsBenchmarkModuleNgFactory);

67
modules/benchmarks/src/views/views-benchmark.ts Normal file
View File

@ -0,0 +1,67 @@
/**
* @license
* Copyright Google Inc. All Rights Reserved.
*
* Use of this source code is governed by an MIT-style license that can be
* found in the LICENSE file at https://angular.io/license
*/
import {CommonModule} from '@angular/common';
import {ChangeDetectorRef, Component, Directive, NgModule, TemplateRef, ViewContainerRef} from '@angular/core';
import {BrowserModule} from '@angular/platform-browser';
@Directive({selector: '[viewManipulationDirective]', exportAs: 'vm'})
export class ViewManipulationDirective {
constructor(private _vcRef: ViewContainerRef, private _tplRef: TemplateRef<any>) {}
create(no: number) {
for (let i = 0; i < no; i++) {
this._vcRef.createEmbeddedView(this._tplRef);
}
}
clear() { this._vcRef.clear(); }
}
@Component({
selector: 'benchmark-root',
template: `
<section>
<button (click)="create(vm)">Create</button>
<button (click)="destroy(vm)">Destroy</button>
<button (click)="check()">Check</button>
</section>
<ng-template viewManipulationDirective #vm="vm">
<div>text</div>
</ng-template>
`
})
export class ViewsBenchmark {
items: number[]|undefined = undefined;
constructor(private _cdRef: ChangeDetectorRef) {}
create(vm: ViewManipulationDirective) { vm.create(1000); }
destroy(vm: ViewManipulationDirective) { vm.clear(); }
check() {
for (let i = 0; i < 10000; i++) {
this._cdRef.detectChanges();
}
}
}
@NgModule({
declarations: [ViewsBenchmark, ViewManipulationDirective],
imports: [
CommonModule,
BrowserModule,
],
bootstrap: [ViewsBenchmark]
})
export class ViewsBenchmarkModule {
}