honeymoose
/
angular-cn
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

build: serve benchmark tree examples with bazel (#28568) 

PR Close #28568
This commit is contained in:
Paul Gschwendtner 2019-02-06 18:02:07 +01:00 committed by Miško Hevery
parent fed8c1d160
commit c916b360bf
30 changed files with 386 additions and 189 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
modules/benchmarks/BUILD.bazel
View File

@ -1,5 +1,10 @@
package(default_visibility = ["//visibility:public"])
exports_files([
"tsconfig-build.json",
"start-server.js",
])
filegroup(
name = "favicon",
srcs = [

22
modules/benchmarks/src/tree/baseline/BUILD.bazel Normal file
View File

@ -0,0 +1,22 @@
load("//tools:defaults.bzl", "ts_library")
load("@build_bazel_rules_typescript//:defs.bzl", "ts_devserver")
package(default_visibility = ["//modules/benchmarks:__subpackages__"])
ts_library(
name = "baseline",
srcs = glob(["*.ts"]),
tsconfig = "//modules/benchmarks:tsconfig-build.json",
deps = [
"//modules/benchmarks/src:util_lib",
"//modules/benchmarks/src/tree:util_lib",
],
)
ts_devserver(
name = "devserver",
entry_module = "angular/modules/benchmarks/src/tree/baseline/index",
index_html = "index.html",
port = 4200,
deps = [":baseline"],
)

12
modules/benchmarks/src/tree/baseline/index.html
View File

@ -1,5 +1,9 @@
<!doctype html>
<html>
<head>
<!-- Prevent the browser from requesting any favicon. -->
<link rel="icon" href="data:,">
</head>
<body>
<h2>Params</h2>
@ -21,11 +25,5 @@
<div>
<tree id="root">Loading...</tree>
</div>
<script>
var mainUrl = window.location.search.split(/[?&]main=([^&]+)/)[1]
|| '../../bootstrap_plain.js';
document.write('<script src="' + mainUrl + '">\u003c/script>');
</script>
</body>
</html>
</html>

26
modules/benchmarks/src/tree/incremental_dom/BUILD.bazel Normal file
View File

@ -0,0 +1,26 @@
load("//tools:defaults.bzl", "ts_library")
load("@build_bazel_rules_typescript//:defs.bzl", "ts_devserver")
package(default_visibility = ["//modules/benchmarks:__subpackages__"])
ts_library(
name = "incremental_dom",
srcs = glob(["*.ts"]),
tsconfig = "//modules/benchmarks:tsconfig-build.json",
deps = [
"//modules/benchmarks/src:util_lib",
"//modules/benchmarks/src/tree:util_lib",
"@ngdeps//@types/node",
],
)
ts_devserver(
name = "devserver",
entry_module = "angular/modules/benchmarks/src/tree/incremental_dom/index",
index_html = "index.html",
port = 4200,
static_files = [
"@ngdeps//node_modules/incremental-dom:dist/incremental-dom.js",
],
deps = [":incremental_dom"],
)

8
modules/benchmarks/src/tree/incremental_dom/index.html
View File

@ -1,5 +1,9 @@
<!doctype html>
<html>
<head>
<!-- Prevent the browser from requesting any favicon. -->
<link rel="icon" href="data:,">
</head>
<body>
<h2>Params</h2>
@ -21,7 +25,5 @@
<div>
<tree id="root"></tree>
</div>
<script src="../../bootstrap_plain.js"></script>
</body>
</html>
</html>

41
modules/benchmarks/src/tree/incremental_dom/index.ts
View File

@ -9,26 +9,27 @@
import {bindAction, profile} from '../../util';
import {buildTree, emptyTree} from '../util';
import {TreeComponent} from './tree';
const {patch} = require('incremental-dom');
export function main() {
let tree: TreeComponent;
let tree: TreeComponent;
function destroyDom() { tree.data = emptyTree; }
function createDom() { tree.data = buildTree(); }
function noop() {}
function init() {
tree = new TreeComponent(document.querySelector('tree'));
bindAction('#destroyDom', destroyDom);
bindAction('#createDom', createDom);
bindAction('#updateDomProfile', profile(createDom, noop, 'update'));
bindAction('#createDomProfile', profile(createDom, destroyDom, 'create'));
}
init();
function destroyDom() {
tree.data = emptyTree;
}
function createDom() {
tree.data = buildTree();
}
function noop() {}
function init() {
tree = new TreeComponent(document.querySelector('tree'));
bindAction('#destroyDom', destroyDom);
bindAction('#createDom', createDom);
bindAction('#updateDomProfile', profile(createDom, noop, 'update'));
bindAction('#createDomProfile', profile(createDom, destroyDom, 'create'));
}
init();

6
modules/benchmarks/src/tree/incremental_dom/tree.ts
View File

@ -7,8 +7,12 @@
*/
import {TreeNode} from '../util';
// We load "IncrementalDOM" as a AMD global because the "incremental-dom" NPM package does not
// come with a named UMD module, and it's easier to just import the AMD file and use it globally.
declare const IncrementalDOM: any;
const {patch, elementOpen, elementClose, elementOpenStart, elementOpenEnd, text, attr} =
require('incremental-dom');
IncrementalDOM;
export class TreeComponent {
constructor(private _rootEl: any) {}

10
modules/benchmarks/src/tree/iv/BUILD.bazel Normal file
View File

@ -0,0 +1,10 @@
load("@build_bazel_rules_typescript//:defs.bzl", "ts_devserver")
package(default_visibility = ["//modules/benchmarks:__subpackages__"])
ts_devserver(
name = "devserver",
index_html = "index.html",
port = 4200,
static_files = ["tree.js"],
)

6
modules/benchmarks/src/tree/iv/index.html
View File

@ -1,5 +1,9 @@
<!doctype html>
<html>
<head>
<!-- Prevent the browser from requesting any favicon. -->
<link rel="icon" href="data:,">
</head>
<body>
<h2>Params</h2>
@ -24,7 +28,5 @@
Change detection runs:<span id="numberOfChecks"></span>
</div>
<div id="root"></div>
<script type="text/javascript" src="tree.js"></script>
</body>
</html>

25
modules/benchmarks/src/tree/ng1/BUILD.bazel Normal file
View File

@ -0,0 +1,25 @@
load("//tools:defaults.bzl", "ts_library")
load("@build_bazel_rules_typescript//:defs.bzl", "ts_devserver")
package(default_visibility = ["//modules/benchmarks:__subpackages__"])
ts_library(
name = "ng1",
srcs = glob(["*.ts"]),
tsconfig = "//modules/benchmarks:tsconfig-build.json",
deps = [
"//modules/benchmarks/src:util_lib",
"//modules/benchmarks/src/tree:util_lib",
],
)
ts_devserver(
name = "devserver",
entry_module = "angular/modules/benchmarks/src/tree/ng1/index",
index_html = "index.html",
port = 4200,
static_files = [
"@ngdeps//node_modules/angular:angular.js",
],
deps = [":ng1"],
)

20
modules/benchmarks/src/tree/ng1/index.html
View File

@ -1,5 +1,9 @@
<!doctype html>
<html>
<head>
<!-- Prevent the browser from requesting any favicon. -->
<link rel="icon" href="data:,">
</head>
<body>
<h2>Params</h2>
@ -26,19 +30,5 @@
<div>
<tree id="root" data="initData">Loading...</tree>
</div>
<script>
var mainUrls = [
'/all/benchmarks/vendor/angular.js',
'../../bootstrap_plain.js'
];
var mainUrl = window.location.search.split(/[?&]main=([^&]+)/)[1];
if (mainUrl) {
mainUrls = [mainUrl];
}
mainUrls.forEach(function(mainUrl) {
document.write('<script src="' + mainUrl + '">\u003c/script>');
});
</script>
</body>
</html>
</html>

32
modules/benchmarks/src/tree/ng2/BUILD.bazel Normal file
View File

@ -0,0 +1,32 @@
load("//tools:defaults.bzl", "ng_module")
load("@build_bazel_rules_typescript//:defs.bzl", "ts_devserver")
package(default_visibility = ["//modules/benchmarks:__subpackages__"])
ng_module(
name = "ng2",
srcs = glob(["*.ts"]),
tsconfig = "//modules/benchmarks:tsconfig-build.json",
# TODO: FW-1004 Type checking is currently not complete.
type_check = False,
deps = [
"//modules/benchmarks/src:util_lib",
"//modules/benchmarks/src/tree:util_lib",
"//packages/core",
"//packages/platform-browser",
"//packages/platform-browser-dynamic",
],
)
ts_devserver(
name = "devserver",
entry_module = "angular/modules/benchmarks/src/tree/ng2/index",
index_html = "index.html",
port = 4200,
scripts = ["@ngdeps//node_modules/tslib:tslib.js"],
static_files = [
"@ngdeps//node_modules/zone.js:dist/zone.js",
"@ngdeps//node_modules/reflect-metadata:Reflect.js",
],
deps = [":ng2"],
)

10
modules/benchmarks/src/tree/ng2/index.html
View File

@ -1,5 +1,9 @@
<!doctype html>
<html>
<head>
<!-- Prevent the browser from requesting any favicon. -->
<link rel="icon" href="data:,">
</head>
<body>
<h2>Params</h2>
@ -26,11 +30,5 @@
<div>
<tree id="root">Loading...</tree>
</div>
<script>
var mainUrl = window.location.search.split(/[?&]main=([^&]+)/)[1]
|| '../../bootstrap_ng2.js';
document.write('<script src="' + mainUrl + '">\u003c/script>');
</script>
</body>
</html>

6
modules/benchmarks/src/tree/ng2/index.ts
View File

@ -12,7 +12,5 @@ import {platformBrowserDynamic} from '@angular/platform-browser-dynamic';
import {init} from './init';
import {AppModule} from './tree';
export function main() {
enableProdMode();
platformBrowserDynamic().bootstrapModule(AppModule).then(init);
}
enableProdMode();
platformBrowserDynamic().bootstrapModule(AppModule).then(init);

26
modules/benchmarks/src/tree/ng2_next/BUILD.bazel Normal file
View File

@ -0,0 +1,26 @@
load("//tools:defaults.bzl", "ts_library")
load("@build_bazel_rules_typescript//:defs.bzl", "ts_devserver")
package(default_visibility = ["//modules/benchmarks:__subpackages__"])
ts_library(
name = "ng2_next",
srcs = glob(["*.ts"]),
tsconfig = "//modules/benchmarks:tsconfig-build.json",
deps = [
"//modules/benchmarks/src:util_lib",
"//modules/benchmarks/src/tree:util_lib",
"//packages/common",
"//packages/core",
"//packages/platform-browser",
],
)
ts_devserver(
name = "devserver",
entry_module = "angular/modules/benchmarks/src/tree/ng2_next/index",
index_html = "index.html",
port = 4200,
scripts = ["@ngdeps//node_modules/tslib:tslib.js"],
deps = [":ng2_next"],
)

10
modules/benchmarks/src/tree/ng2_next/index.html
View File

@ -1,5 +1,9 @@
<!doctype html>
<html>
<head>
<!-- Prevent the browser from requesting any favicon. -->
<link rel="icon" href="data:,">
</head>
<body>
<h2>Params</h2>
@ -26,11 +30,5 @@
<div>
<tree id="root">Loading...</tree>
</div>
<script>
var mainUrl = window.location.search.split(/[?&]main=([^&]+)/)[1]
|| '../../bootstrap_ng2.js';
document.write('<script src="' + mainUrl + '">\u003c/script>');
</script>
</body>
</html>

72
modules/benchmarks/src/tree/ng2_next/index.ts
View File

@ -13,42 +13,40 @@ import {buildTree, emptyTree} from '../util';
import {AppModule, TreeComponent} from './tree';
export function main() {
let tree: TreeComponent;
let appMod: AppModule;
let detectChangesRuns = 0;
let tree: TreeComponent;
let appMod: AppModule;
let detectChangesRuns = 0;
function destroyDom() {
tree.data = emptyTree;
appMod.tick();
}
function createDom() {
tree.data = buildTree();
appMod.tick();
}
function detectChanges() {
for (let i = 0; i < 10; i++) {
appMod.tick();
}
detectChangesRuns += 10;
numberOfChecksEl.textContent = `${detectChangesRuns}`;
}
function noop() {}
const numberOfChecksEl = document.getElementById('numberOfChecks');
enableProdMode();
appMod = new AppModule();
appMod.bootstrap();
tree = appMod.componentRef.instance;
bindAction('#destroyDom', destroyDom);
bindAction('#createDom', createDom);
bindAction('#detectChanges', detectChanges);
bindAction('#detectChangesProfile', profile(detectChanges, noop, 'detectChanges'));
bindAction('#updateDomProfile', profile(createDom, noop, 'update'));
bindAction('#createDomProfile', profile(createDom, destroyDom, 'create'));
function destroyDom() {
tree.data = emptyTree;
appMod.tick();
}
function createDom() {
tree.data = buildTree();
appMod.tick();
}
function detectChanges() {
for (let i = 0; i < 10; i++) {
appMod.tick();
}
detectChangesRuns += 10;
numberOfChecksEl.textContent = `${detectChangesRuns}`;
}
function noop() {}
const numberOfChecksEl = document.getElementById('numberOfChecks');
enableProdMode();
appMod = new AppModule();
appMod.bootstrap();
tree = appMod.componentRef.instance;
bindAction('#destroyDom', destroyDom);
bindAction('#createDom', createDom);
bindAction('#detectChanges', detectChanges);
bindAction('#detectChangesProfile', profile(detectChanges, noop, 'detectChanges'));
bindAction('#updateDomProfile', profile(createDom, noop, 'update'));
bindAction('#createDomProfile', profile(createDom, destroyDom, 'create'));

30
modules/benchmarks/src/tree/ng2_static/BUILD.bazel Normal file
View File

@ -0,0 +1,30 @@
load("//tools:defaults.bzl", "ts_library")
load("@build_bazel_rules_typescript//:defs.bzl", "ts_devserver")
package(default_visibility = ["//modules/benchmarks:__subpackages__"])
ts_library(
name = "ng2_static",
srcs = glob(["*.ts"]),
tsconfig = "//modules/benchmarks:tsconfig-build.json",
deps = [
"//modules/benchmarks/src:util_lib",
"//modules/benchmarks/src/tree:util_lib",
"//packages/core",
"//packages/platform-browser",
"//packages/platform-browser-dynamic",
],
)
ts_devserver(
name = "devserver",
entry_module = "angular/modules/benchmarks/src/tree/ng2_static/index",
index_html = "index.html",
port = 4200,
scripts = ["@ngdeps//node_modules/tslib:tslib.js"],
static_files = [
"@ngdeps//node_modules/zone.js:dist/zone.js",
"@ngdeps//node_modules/reflect-metadata:Reflect.js",
],
deps = [":ng2_static"],
)

8
modules/benchmarks/src/tree/ng2_static/index.html
View File

@ -1,5 +1,9 @@
<!doctype html>
<html>
<head>
<!-- Prevent the browser from requesting any favicon. -->
<link rel="icon" href="data:,">
</head>
<body>
<h2>Params</h2>
<form>
@ -20,7 +24,5 @@
<div>
<tree id="root"></tree>
</div>
<script src="../../bootstrap_ng2.js"></script>
</body>
</html>
</html>

58
modules/benchmarks/src/tree/ng2_static/index.ts
View File

@ -14,35 +14,33 @@ import {buildTree, emptyTree} from '../util';
import {AppModule, RootTreeComponent} from './tree';
export function main() {
let tree: RootTreeComponent;
let appRef: ApplicationRef;
let tree: RootTreeComponent;
let appRef: ApplicationRef;
function destroyDom() {
tree.data = emptyTree;
appRef.tick();
}
function createDom() {
tree.data = buildTree();
appRef.tick();
}
function noop() {}
function init() {
enableProdMode();
platformBrowserDynamic().bootstrapModule(AppModule).then((ref) => {
const injector = ref.injector;
appRef = injector.get(ApplicationRef);
tree = appRef.components[0].instance;
bindAction('#destroyDom', destroyDom);
bindAction('#createDom', createDom);
bindAction('#updateDomProfile', profile(createDom, noop, 'update'));
bindAction('#createDomProfile', profile(createDom, destroyDom, 'create'));
});
}
init();
function destroyDom() {
tree.data = emptyTree;
appRef.tick();
}
function createDom() {
tree.data = buildTree();
appRef.tick();
}
function noop() {}
function init() {
enableProdMode();
platformBrowserDynamic().bootstrapModule(AppModule).then((ref) => {
const injector = ref.injector;
appRef = injector.get(ApplicationRef);
tree = appRef.components[0].instance;
bindAction('#destroyDom', destroyDom);
bindAction('#createDom', createDom);
bindAction('#updateDomProfile', profile(createDom, noop, 'update'));
bindAction('#createDomProfile', profile(createDom, destroyDom, 'create'));
});
}
init();

32
modules/benchmarks/src/tree/ng2_switch/BUILD.bazel Normal file
View File

@ -0,0 +1,32 @@
load("//tools:defaults.bzl", "ng_module")
load("@build_bazel_rules_typescript//:defs.bzl", "ts_devserver")
package(default_visibility = ["//modules/benchmarks:__subpackages__"])
ng_module(
name = "ng2_switch",
srcs = glob(["*.ts"]),
tsconfig = "//modules/benchmarks:tsconfig-build.json",
# TODO: FW-1004 Type checking is currently not complete.
type_check = False,
deps = [
"//modules/benchmarks/src:util_lib",
"//modules/benchmarks/src/tree:util_lib",
"//packages/core",
"//packages/platform-browser",
"//packages/platform-browser-dynamic",
],
)
ts_devserver(
name = "devserver",
entry_module = "angular/modules/benchmarks/src/tree/ng2_switch/index",
index_html = "index.html",
port = 4200,
scripts = ["@ngdeps//node_modules/tslib:tslib.js"],
static_files = [
"@ngdeps//node_modules/zone.js:dist/zone.js",
"@ngdeps//node_modules/reflect-metadata:Reflect.js",
],
deps = [":ng2_switch"],
)

10
modules/benchmarks/src/tree/ng2_switch/index.html
View File

@ -1,5 +1,9 @@
<!doctype html>
<html>
<head>
<!-- Prevent the browser from requesting any favicon. -->
<link rel="icon" href="data:,">
</head>
<body>
<h2>Params</h2>
@ -21,11 +25,5 @@
<div>
<tree id="root">Loading...</tree>
</div>
<script>
var mainUrl = window.location.search.split(/[?&]main=([^&]+)/)[1]
|| '../../bootstrap_ng2.js';
document.write('<script src="' + mainUrl + '">\u003c/script>');
</script>
</body>
</html>

6
modules/benchmarks/src/tree/ng2_switch/index.ts
View File

@ -12,7 +12,5 @@ import {platformBrowserDynamic} from '@angular/platform-browser-dynamic';
import {init} from './init';
import {AppModule} from './tree';
export function main() {
enableProdMode();
platformBrowserDynamic().bootstrapModule(AppModule).then(init);
}
enableProdMode();
platformBrowserDynamic().bootstrapModule(AppModule).then(init);

16
modules/benchmarks/src/tree/render3/BUILD.bazel
View File

@ -1,4 +1,4 @@
package(default_visibility = ["//visibility:public"])
package(default_visibility = ["//modules/benchmarks:__subpackages__"])
load("//tools:defaults.bzl", "ng_module", "ng_rollup_bundle")
load("//packages/bazel:index.bzl", "protractor_web_test_suite")
@ -6,11 +6,7 @@ load("@build_bazel_rules_typescript//:defs.bzl", "ts_devserver")
ng_module(
name = "tree_lib",
srcs = glob(
[
"**/*.ts",
],
),
srcs = glob(["**/*.ts"]),
tags = ["ivy-only"],
deps = [
"//modules/benchmarks/src/tree:util_lib",
@ -30,20 +26,12 @@ ng_rollup_bundle(
],
)
genrule(
name = "favicon",
srcs = ["//modules/benchmarks:favicon"],
outs = ["favicon.ico"],
cmd = "cp $< $@",
)
ts_devserver(
name = "devserver",
static_files = [
":bundle.min_debug.js",
":bundle.min.js",
"index.html",
":favicon",
],
tags = ["ivy-only"],
)

4
modules/benchmarks/src/tree/render3/index.html
View File

@ -1,5 +1,9 @@
<!doctype html>
<html>
<head>
<!-- Prevent the browser from requesting any favicon. -->
<link rel="icon" href="data:,">
</head>
<body>
<h2>Params</h2>

27
modules/benchmarks/src/tree/render3_function/BUILD.bazel
View File

@ -1,19 +1,26 @@
package(default_visibility = ["//visibility:public"])
load("@build_bazel_rules_typescript//:defs.bzl", "ts_devserver")
load("//tools:defaults.bzl", "ts_library")
load("//tools:defaults.bzl", "ng_module")
package(default_visibility = ["//modules/benchmarks:__subpackages__"])
ng_module(
ts_library(
name = "render3_function_lib",
srcs = glob(
[
"**/*.ts",
],
),
srcs = glob(["**/*.ts"]),
deps = [
"//modules/benchmarks/src:util_lib",
"//modules/benchmarks/src/tree:util_lib",
"//modules/benchmarks/src/tree/render3:tree_lib",
"//packages:types",
"//packages/core",
"@rxjs",
],
)
ts_devserver(
name = "devserver",
entry_module = "angular/modules/benchmarks/src/tree/render3_function/index",
index_html = "index.html",
port = 4200,
scripts = ["@ngdeps//node_modules/tslib:tslib.js"],
deps = [":render3_function_lib"],
)
],
)

7
modules/benchmarks/src/tree/render3_function/index.html
View File

@ -1,5 +1,9 @@
<!doctype html>
<html>
<head>
<!-- Prevent the browser from requesting any favicon. -->
<link rel="icon" href="data:,">
</head>
<body>
<h2>Params</h2>
@ -30,9 +34,6 @@
<script>
// TODO(mlaval): remove once we have a proper solution
ngDevMode = false;
var mainUrl = window.location.search.split(/[?&]main=([^&]+)/)[1]
|| '../../bootstrap_ng2.js';
document.write('<script src="' + mainUrl + '">\u003c/script>');
</script>
</body>
</html>

32
modules/benchmarks/src/tree/render3_function/index.ts
View File

@ -14,23 +14,6 @@ import {TreeNode, emptyTree} from '../util';
function noop() {}
export function main() {
let component: TreeFunction;
if (typeof window !== 'undefined') {
component = renderComponent(TreeFunction);
bindAction('#createDom', () => createDom(component as any));
bindAction('#destroyDom', () => destroyDom(component as any));
bindAction('#detectChanges', () => detectChanges(component as any));
bindAction(
'#detectChangesProfile',
profile(() => detectChanges(component as any), noop, 'detectChanges'));
bindAction('#updateDomProfile', profile(() => createDom(component as any), noop, 'update'));
bindAction(
'#createDomProfile',
profile(() => createDom(component as any), () => destroyDom(component as any), 'create'));
}
}
export class TreeFunction {
data: TreeNode = emptyTree;
@ -86,3 +69,18 @@ export function TreeTpl(rf: ɵRenderFlags, ctx: TreeNode) {
ɵcontainerRefreshEnd();
}
}
let component: TreeFunction;
if (typeof window !== 'undefined') {
component = renderComponent(TreeFunction);
bindAction('#createDom', () => createDom(component as any));
bindAction('#destroyDom', () => destroyDom(component as any));
bindAction('#detectChanges', () => detectChanges(component as any));
bindAction(
'#detectChangesProfile',
profile(() => detectChanges(component as any), noop, 'detectChanges'));
bindAction('#updateDomProfile', profile(() => createDom(component as any), noop, 'update'));
bindAction(
'#createDomProfile',
profile(() => createDom(component as any), () => destroyDom(component as any), 'create'));
}

6
modules/benchmarks/tsconfig-build.json Normal file
View File

@ -0,0 +1,6 @@
{
"compilerOptions": {
"lib": ["dom", "es2015"],
"types": []
}
}

2
package.json
View File

@ -69,6 +69,7 @@
"domino": "2.1.0",
"fs-extra": "4.0.2",
"hammerjs": "2.0.8",
"incremental-dom": "0.4.1",
"jasmine": "^3.1.0",
"jasmine-core": "^3.1.0",
"karma": "^3.1.4",
@ -125,7 +126,6 @@
"gulp-git": "^2.7.0",
"gulp-tslint": "8.1.2",
"husky": "^0.14.3",
"incremental-dom": "0.4.1",
"jpm": "1.3.1",
"karma-browserstack-launcher": "^1.3.0",
"karma-chrome-launcher": "^2.2.0",