perf(ivy): introduce new benchmark for view create, destroy, traverse (#31797)
PR Close #31797
This commit is contained in:
Pawel Kozlowski
Miško Hevery
parent
c7542a1d09
commit
85d051f8d5
|
|
@ -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"],
|
||||
)
|
||||
|
|
@ -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>
|
||||
|
|
@ -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);
|
||||
|
|
@ -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 {
|
||||
}
|
||||
Loading…
Reference in New Issue