perf: add button for profiling tree benchmark

modules/benchmarks/src/tree/tree_benchmark.html

@@ -6,12 +6,16 @@
 <p>
 <button id="ng2DestroyDom">destroyDom</button>
 <button id="ng2CreateDom">createDom</button>
+<button id="ng2UpdateDomProfile">profile updateDom</button>
+<button id="ng2CreateDomProfile">profile createDom</button>
 </p>
 
 <h2>Baseline tree benchmark</h2>
 <p>
 <button id="baselineDestroyDom">destroyDom</button>
 <button id="baselineCreateDom">createDom</button>
+<button id="baselineUpdateDomProfile">profile updateDom</button>
+<button id="baselineCreateDomProfile">profile createDom</button>
 </p>
 
 <div>

modules/benchmarks/src/tree/tree_benchmark.js

@@ -8,7 +8,7 @@ import {TemplateLoader} from 'core/compiler/template_loader';
 import {LifeCycle} from 'core/life_cycle/life_cycle';
 
 import {reflector} from 'reflection/reflection';
-import {DOM, document, Element} from 'facade/dom';
+import {DOM, document, window, Element} from 'facade/dom';
 import {isPresent} from 'facade/lang';
 
 var MAX_DEPTH = 9;
@@ -135,6 +135,23 @@ export function main() {
     changeDetector.detectChanges();
   }
 
+  function profile(create, destroy, name) {
+    return function(_) {
+      window.console.profile(name);
+      var duration = 0;
+      var count = 0;
+      while(duration < 5000) {
+        var start = window.performance.now();
+        create(_);
+        duration += window.performance.now() - start;
+        destroy(_);
+        count++;
+      }
+      window.console.profileEnd(name);
+      window.console.log(`Iterations: ${count}; time: ${duration / count} ms / iteration`);
+    };
+  }
+
   function ng2CreateDom(_) {
     var values = count++ % 2 == 0 ?
       ['0', '1', '2', '3', '4', '5', '6', '7', '8', '9', '*'] :
@@ -144,12 +161,16 @@ export function main() {
     changeDetector.detectChanges();
   }
 
+  function noop() {}
+
   function initNg2() {
     bootstrap(AppComponent).then((injector) => {
       changeDetector = injector.get(ChangeDetector);
       app = injector.get(AppComponent);
       DOM.on(DOM.querySelector(document, '#ng2DestroyDom'), 'click', ng2DestroyDom);
       DOM.on(DOM.querySelector(document, '#ng2CreateDom'), 'click', ng2CreateDom);
+      DOM.on(DOM.querySelector(document, '#ng2UpdateDomProfile'), 'click', profile(ng2CreateDom, noop, 'ng2-update'));
+      DOM.on(DOM.querySelector(document, '#ng2CreateDomProfile'), 'click', profile(ng2CreateDom, ng2DestroyDom, 'ng2-create'));
     });
   }
 
@@ -170,6 +191,8 @@ export function main() {
     DOM.appendChild(DOM.querySelector(document, 'baseline'), baselineRootTreeComponent.element);
     DOM.on(DOM.querySelector(document, '#baselineDestroyDom'), 'click', baselineDestroyDom);
     DOM.on(DOM.querySelector(document, '#baselineCreateDom'), 'click', baselineCreateDom);
+    DOM.on(DOM.querySelector(document, '#baselineUpdateDomProfile'), 'click', profile(baselineCreateDom, noop, 'baseline-update'));
+    DOM.on(DOM.querySelector(document, '#baselineCreateDomProfile'), 'click', profile(baselineCreateDom, baselineDestroyDom, 'baseline-create'));
   }
 
   initNg2();

modules/facade/src/dom.dart

@@ -3,7 +3,7 @@ library angular.core.facade.dom;
 import 'dart:html';
 import 'dart:js' show JsObject;
 
-export 'dart:html' show DocumentFragment, Node, Element, TemplateElement, Text, document, location;
+export 'dart:html' show DocumentFragment, Node, Element, TemplateElement, Text, document, location, window;
 
 // TODO(tbosch): Is there a builtin one? Why is Dart
 // removing unknown elements by default?

modules/facade/src/dom.es6

@@ -1,3 +1,4 @@
+export var window = frames.window;
 export var DocumentFragment = window.DocumentFragment;
 export var Node = window.Node;
 export var NodeList = window.NodeList;