feat(test): add benchmark page (#1076)

angular · Mar 11, 2019 · 128649a · 128649a
1 parent 917e2af
commit 128649a
Show file tree

Hide file tree

Showing 8 changed files with 866 additions and 0 deletions.
diff --git a/test/performance/eventTarget.js b/test/performance/eventTarget.js
@@ -0,0 +1,84 @@
+/**
+ * @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
+ */
+(function(_global) {
+  var testRunner = _global['__zone_symbol__testRunner'];
+  var mark = _global['__zone_symbol__mark'];
+  var measure = _global['__zone_symbol__measure'];
+  var zone = _global['__zone_symbol__callbackZone'];
+  var button;
+  var testTarget = {
+    title: 'addEventListener',
+    times: 10,
+    before: function() {
+      button = document.createElement('button');
+      document.body.appendChild(button);
+      _global['__zone_symbol__callbackContext'].measureName = 'addEventListener_callback';
+      _global['__zone_symbol__callbackContext'].type = 'eventTask';
+      _global['__zone_symbol__callbackContext'].source = 'addEventListener';
+    },
+    after: function() {
+      document.body.removeChild(button);
+      button = null;
+    },
+    apis: [
+      {
+        supportClear: true,
+        method: 'addEventListener',
+        nativeMethod: '__zone_symbol__addEventListener',
+        clearMethod: 'removeEventListener',
+        nativeClearMethod: '__zone_symbol__removeEventListener',
+        run: function() {
+          var listener = function() {};
+          button.addEventListener('click', listener);
+          return listener;
+        },
+        runClear: function(timerId) {
+          return button.removeEventListener('click', timerId);
+        },
+        nativeRun: function() {
+          var listener = function() {};
+          button['__zone_symbol__addEventListener']('click', listener);
+          return listener;
+        },
+        nativeRunClear: function(timerId) {
+          return button['__zone_symbol__removeEventListener']('click', timerId);
+        }
+      },
+      {
+        isCallback: true,
+        supportClear: false,
+        method: 'addEventListener_callback',
+        nativeMethod: 'native_addEventListener_callback',
+        run: function() {
+          var listener = function() {};
+          zone.run(function() {
+            button.addEventListener('click', listener);
+          });
+          var event = document.createEvent('Event');
+          event.initEvent('click', true, true);
+          button.dispatchEvent(event);
+          button.removeEventListener('click', listener);
+        },
+        nativeRun: function() {
+          var func = function() {};
+          var listener = function() {
+            mark('native_addEventListener_callback');
+            func.apply(this, arguments);
+            measure('native_addEventListener_callback', 'native_addEventListener_callback');
+          };
+          button['__zone_symbol__addEventListener']('click', listener);
+          var event = document.createEvent('Event');
+          event.initEvent('click', true, true);
+          button.dispatchEvent(event);
+          button['__zone_symbol__removeEventListener']('click', listener);
+        }
+      }
+    ],
+  };
+  return testRunner(testTarget);
+}(typeof window === 'undefined' ? global : window));
diff --git a/test/performance/performance.html b/test/performance/performance.html
@@ -0,0 +1,73 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+  <style>
+    table {
+      border-collapse: collapse;
+    }
+
+    table,
+    th,
+    td {
+      border: 1px solid black;
+    }
+
+    ul {
+      font-size: 24px
+    }
+
+    li {
+      font-size: 16px
+    }
+  </style>
+  <script src='../../dist/zone.js'></script>
+  <script src='./performance_setup.js'></script>
+  <script src='./performance_ui.js'></script>
+  <script src='./timeout.js'></script>
+  <script src='./requestAnimationFrame.js'></script>
+  <script src='./eventTarget.js'></script>
+  <script src='./xhr.js'></script>
+  <script src='./promise.js'></script>
+  <script>
+    window.onload = function () {
+      var jsonResult = {};
+
+      var div = document.getElementById('tests');
+      var json = document.getElementById('json');
+      var table = document.getElementById('summary');
+
+      var tests = window['__zone_symbol__performance_tasks'];
+      window['__zone_symbol__testTargetsUIBuild']({
+        tests: tests,
+        targetContainer: div,
+        resultsContainer: table,
+        jsonContainer: json,
+        jsonResult: jsonResult
+      });
+    }
+  </script>
+</head>
+
+<body>
+  <div id="thetext">Performance Bencnhmark of Zone.js vs Native Delegate!</div>
+  <div id="tests"></div>
+  <div>
+    <table id="summary" class="table">
+      <tr class="tableheader">
+        <th>
+          Module
+        </th>
+        <th>
+          API
+        </th>
+        <th>
+          Performance overhead
+        </th>
+      </tr>
+    </table>
+  </div>
+  <div id="json"></div>
+</body>
+
+</html>