From c916b360bf354b97883862db477d286c3fbc6cfe Mon Sep 17 00:00:00 2001
From: Paul Gschwendtner <paulgschwendtner@gmail.com>
Date: Wed, 6 Feb 2019 18:02:07 +0100
Subject: [PATCH] build: serve benchmark tree examples with bazel (#28568)

PR Close #28568
---
 modules/benchmarks/BUILD.bazel                |  5 ++
 .../benchmarks/src/tree/baseline/BUILD.bazel  | 22 ++++++
 .../benchmarks/src/tree/baseline/index.html   | 12 ++--
 .../src/tree/incremental_dom/BUILD.bazel      | 26 +++++++
 .../src/tree/incremental_dom/index.html       |  8 ++-
 .../src/tree/incremental_dom/index.ts         | 41 +++++------
 .../src/tree/incremental_dom/tree.ts          |  6 +-
 modules/benchmarks/src/tree/iv/BUILD.bazel    | 10 +++
 modules/benchmarks/src/tree/iv/index.html     |  6 +-
 modules/benchmarks/src/tree/ng1/BUILD.bazel   | 25 +++++++
 modules/benchmarks/src/tree/ng1/index.html    | 20 ++----
 modules/benchmarks/src/tree/ng2/BUILD.bazel   | 32 +++++++++
 modules/benchmarks/src/tree/ng2/index.html    | 10 ++-
 modules/benchmarks/src/tree/ng2/index.ts      |  6 +-
 .../benchmarks/src/tree/ng2_next/BUILD.bazel  | 26 +++++++
 .../benchmarks/src/tree/ng2_next/index.html   | 10 ++-
 modules/benchmarks/src/tree/ng2_next/index.ts | 72 +++++++++----------
 .../src/tree/ng2_static/BUILD.bazel           | 30 ++++++++
 .../benchmarks/src/tree/ng2_static/index.html |  8 ++-
 .../benchmarks/src/tree/ng2_static/index.ts   | 58 ++++++++-------
 .../src/tree/ng2_switch/BUILD.bazel           | 32 +++++++++
 .../benchmarks/src/tree/ng2_switch/index.html | 10 ++-
 .../benchmarks/src/tree/ng2_switch/index.ts   |  6 +-
 .../benchmarks/src/tree/render3/BUILD.bazel   | 16 +----
 .../benchmarks/src/tree/render3/index.html    |  4 ++
 .../src/tree/render3_function/BUILD.bazel     | 27 ++++---
 .../src/tree/render3_function/index.html      |  7 +-
 .../src/tree/render3_function/index.ts        | 32 ++++-----
 modules/benchmarks/tsconfig-build.json        |  6 ++
 package.json                                  |  2 +-
 30 files changed, 386 insertions(+), 189 deletions(-)
 create mode 100644 modules/benchmarks/src/tree/baseline/BUILD.bazel
 create mode 100644 modules/benchmarks/src/tree/incremental_dom/BUILD.bazel
 create mode 100644 modules/benchmarks/src/tree/iv/BUILD.bazel
 create mode 100644 modules/benchmarks/src/tree/ng1/BUILD.bazel
 create mode 100644 modules/benchmarks/src/tree/ng2/BUILD.bazel
 create mode 100644 modules/benchmarks/src/tree/ng2_next/BUILD.bazel
 create mode 100644 modules/benchmarks/src/tree/ng2_static/BUILD.bazel
 create mode 100644 modules/benchmarks/src/tree/ng2_switch/BUILD.bazel
 create mode 100644 modules/benchmarks/tsconfig-build.json

diff --git a/modules/benchmarks/BUILD.bazel b/modules/benchmarks/BUILD.bazel
index 8ef1f366db..aea00ace1e 100644
--- a/modules/benchmarks/BUILD.bazel
+++ b/modules/benchmarks/BUILD.bazel
@@ -1,5 +1,10 @@
 package(default_visibility = ["//visibility:public"])
 
+exports_files([
+    "tsconfig-build.json",
+    "start-server.js",
+])
+
 filegroup(
     name = "favicon",
     srcs = [
diff --git a/modules/benchmarks/src/tree/baseline/BUILD.bazel b/modules/benchmarks/src/tree/baseline/BUILD.bazel
new file mode 100644
index 0000000000..692ad22e76
--- /dev/null
+++ b/modules/benchmarks/src/tree/baseline/BUILD.bazel
@@ -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"],
+)
diff --git a/modules/benchmarks/src/tree/baseline/index.html b/modules/benchmarks/src/tree/baseline/index.html
index 3bfb634097..5e6983d0fc 100644
--- a/modules/benchmarks/src/tree/baseline/index.html
+++ b/modules/benchmarks/src/tree/baseline/index.html
@@ -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>
\ No newline at end of file
+</html>
diff --git a/modules/benchmarks/src/tree/incremental_dom/BUILD.bazel b/modules/benchmarks/src/tree/incremental_dom/BUILD.bazel
new file mode 100644
index 0000000000..d0ff842a5b
--- /dev/null
+++ b/modules/benchmarks/src/tree/incremental_dom/BUILD.bazel
@@ -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"],
+)
diff --git a/modules/benchmarks/src/tree/incremental_dom/index.html b/modules/benchmarks/src/tree/incremental_dom/index.html
index 99335bd3e4..0853f8d5c0 100644
--- a/modules/benchmarks/src/tree/incremental_dom/index.html
+++ b/modules/benchmarks/src/tree/incremental_dom/index.html
@@ -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>
\ No newline at end of file
+</html>
diff --git a/modules/benchmarks/src/tree/incremental_dom/index.ts b/modules/benchmarks/src/tree/incremental_dom/index.ts
index d730a47c66..a14ccc7221 100644
--- a/modules/benchmarks/src/tree/incremental_dom/index.ts
+++ b/modules/benchmarks/src/tree/incremental_dom/index.ts
@@ -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();
diff --git a/modules/benchmarks/src/tree/incremental_dom/tree.ts b/modules/benchmarks/src/tree/incremental_dom/tree.ts
index 3915288cec..0a5a23ab6b 100644
--- a/modules/benchmarks/src/tree/incremental_dom/tree.ts
+++ b/modules/benchmarks/src/tree/incremental_dom/tree.ts
@@ -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) {}
diff --git a/modules/benchmarks/src/tree/iv/BUILD.bazel b/modules/benchmarks/src/tree/iv/BUILD.bazel
new file mode 100644
index 0000000000..7cebf516b7
--- /dev/null
+++ b/modules/benchmarks/src/tree/iv/BUILD.bazel
@@ -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"],
+)
diff --git a/modules/benchmarks/src/tree/iv/index.html b/modules/benchmarks/src/tree/iv/index.html
index fd0d7f85a7..5d9ef00dfd 100644
--- a/modules/benchmarks/src/tree/iv/index.html
+++ b/modules/benchmarks/src/tree/iv/index.html
@@ -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>
diff --git a/modules/benchmarks/src/tree/ng1/BUILD.bazel b/modules/benchmarks/src/tree/ng1/BUILD.bazel
new file mode 100644
index 0000000000..796cf5a681
--- /dev/null
+++ b/modules/benchmarks/src/tree/ng1/BUILD.bazel
@@ -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"],
+)
diff --git a/modules/benchmarks/src/tree/ng1/index.html b/modules/benchmarks/src/tree/ng1/index.html
index ee7c5b37e6..a522c3002c 100644
--- a/modules/benchmarks/src/tree/ng1/index.html
+++ b/modules/benchmarks/src/tree/ng1/index.html
@@ -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>
\ No newline at end of file
+</html>
diff --git a/modules/benchmarks/src/tree/ng2/BUILD.bazel b/modules/benchmarks/src/tree/ng2/BUILD.bazel
new file mode 100644
index 0000000000..5069a15710
--- /dev/null
+++ b/modules/benchmarks/src/tree/ng2/BUILD.bazel
@@ -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"],
+)
diff --git a/modules/benchmarks/src/tree/ng2/index.html b/modules/benchmarks/src/tree/ng2/index.html
index 266162c0a4..fee0d1588e 100644
--- a/modules/benchmarks/src/tree/ng2/index.html
+++ b/modules/benchmarks/src/tree/ng2/index.html
@@ -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>
diff --git a/modules/benchmarks/src/tree/ng2/index.ts b/modules/benchmarks/src/tree/ng2/index.ts
index 3dc8eab927..9e3d67c59b 100644
--- a/modules/benchmarks/src/tree/ng2/index.ts
+++ b/modules/benchmarks/src/tree/ng2/index.ts
@@ -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);
diff --git a/modules/benchmarks/src/tree/ng2_next/BUILD.bazel b/modules/benchmarks/src/tree/ng2_next/BUILD.bazel
new file mode 100644
index 0000000000..59fe333d45
--- /dev/null
+++ b/modules/benchmarks/src/tree/ng2_next/BUILD.bazel
@@ -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"],
+)
diff --git a/modules/benchmarks/src/tree/ng2_next/index.html b/modules/benchmarks/src/tree/ng2_next/index.html
index 69fcee27da..7057fe1268 100644
--- a/modules/benchmarks/src/tree/ng2_next/index.html
+++ b/modules/benchmarks/src/tree/ng2_next/index.html
@@ -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>
diff --git a/modules/benchmarks/src/tree/ng2_next/index.ts b/modules/benchmarks/src/tree/ng2_next/index.ts
index 1de8c0041c..0a4416796a 100644
--- a/modules/benchmarks/src/tree/ng2_next/index.ts
+++ b/modules/benchmarks/src/tree/ng2_next/index.ts
@@ -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'));
diff --git a/modules/benchmarks/src/tree/ng2_static/BUILD.bazel b/modules/benchmarks/src/tree/ng2_static/BUILD.bazel
new file mode 100644
index 0000000000..44efe74ffc
--- /dev/null
+++ b/modules/benchmarks/src/tree/ng2_static/BUILD.bazel
@@ -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"],
+)
diff --git a/modules/benchmarks/src/tree/ng2_static/index.html b/modules/benchmarks/src/tree/ng2_static/index.html
index 3b4659e1d2..91be35f9a4 100644
--- a/modules/benchmarks/src/tree/ng2_static/index.html
+++ b/modules/benchmarks/src/tree/ng2_static/index.html
@@ -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>
\ No newline at end of file
+</html>
diff --git a/modules/benchmarks/src/tree/ng2_static/index.ts b/modules/benchmarks/src/tree/ng2_static/index.ts
index f4f34cb546..e28ba1ab8c 100644
--- a/modules/benchmarks/src/tree/ng2_static/index.ts
+++ b/modules/benchmarks/src/tree/ng2_static/index.ts
@@ -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();
diff --git a/modules/benchmarks/src/tree/ng2_switch/BUILD.bazel b/modules/benchmarks/src/tree/ng2_switch/BUILD.bazel
new file mode 100644
index 0000000000..738ed3f030
--- /dev/null
+++ b/modules/benchmarks/src/tree/ng2_switch/BUILD.bazel
@@ -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"],
+)
diff --git a/modules/benchmarks/src/tree/ng2_switch/index.html b/modules/benchmarks/src/tree/ng2_switch/index.html
index 2f3d6a3d7b..2eef92aa4f 100644
--- a/modules/benchmarks/src/tree/ng2_switch/index.html
+++ b/modules/benchmarks/src/tree/ng2_switch/index.html
@@ -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>
diff --git a/modules/benchmarks/src/tree/ng2_switch/index.ts b/modules/benchmarks/src/tree/ng2_switch/index.ts
index 3dc8eab927..9e3d67c59b 100644
--- a/modules/benchmarks/src/tree/ng2_switch/index.ts
+++ b/modules/benchmarks/src/tree/ng2_switch/index.ts
@@ -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);
diff --git a/modules/benchmarks/src/tree/render3/BUILD.bazel b/modules/benchmarks/src/tree/render3/BUILD.bazel
index e9cb5f1d09..9e7e7af73b 100644
--- a/modules/benchmarks/src/tree/render3/BUILD.bazel
+++ b/modules/benchmarks/src/tree/render3/BUILD.bazel
@@ -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"],
 )
diff --git a/modules/benchmarks/src/tree/render3/index.html b/modules/benchmarks/src/tree/render3/index.html
index b5b1ea3614..0f86ab6ac4 100644
--- a/modules/benchmarks/src/tree/render3/index.html
+++ b/modules/benchmarks/src/tree/render3/index.html
@@ -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>
diff --git a/modules/benchmarks/src/tree/render3_function/BUILD.bazel b/modules/benchmarks/src/tree/render3_function/BUILD.bazel
index 1e8adc00de..48f531cbaa 100644
--- a/modules/benchmarks/src/tree/render3_function/BUILD.bazel
+++ b/modules/benchmarks/src/tree/render3_function/BUILD.bazel
@@ -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"],
+)
     ],
 )
diff --git a/modules/benchmarks/src/tree/render3_function/index.html b/modules/benchmarks/src/tree/render3_function/index.html
index d71594cf18..96284c3dbe 100644
--- a/modules/benchmarks/src/tree/render3_function/index.html
+++ b/modules/benchmarks/src/tree/render3_function/index.html
@@ -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>
diff --git a/modules/benchmarks/src/tree/render3_function/index.ts b/modules/benchmarks/src/tree/render3_function/index.ts
index afb084ac76..a4e4785632 100644
--- a/modules/benchmarks/src/tree/render3_function/index.ts
+++ b/modules/benchmarks/src/tree/render3_function/index.ts
@@ -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'));
+}
diff --git a/modules/benchmarks/tsconfig-build.json b/modules/benchmarks/tsconfig-build.json
new file mode 100644
index 0000000000..d18dc325cc
--- /dev/null
+++ b/modules/benchmarks/tsconfig-build.json
@@ -0,0 +1,6 @@
+{
+  "compilerOptions": {
+    "lib": ["dom", "es2015"],
+    "types": []
+  }
+}
diff --git a/package.json b/package.json
index d6d385120b..eca02e9a67 100644
--- a/package.json
+++ b/package.json
@@ -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",