├── .gitignore
├── README.md
├── bower.json
├── perf-lib
    ├── frame-tester.html
    └── perf.js
└── sample
    ├── elements
        ├── test1-element.html
        └── test2-element.html
    ├── harness.html
    ├── runner.html
    ├── test1.html
    └── test2.html


/.gitignore:
--------------------------------------------------------------------------------
1 | bower_components
2 | 


--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
 1 | # polyperf
 2 | 
 3 | `polyperf` is a simple performance testing harness. It loads a series of target pages
 4 | (each in their own iframe) a configurable number of times, and displays the successive run
 5 | times, as well as the overall minimum.
 6 | 
 7 | ## Installing and running
 8 | 
 9 | Run
10 | ```
11 | bower install
12 | polyserve
13 | ```
14 | 
15 | Then navigate to  [http://localhost:8080/components/polyperf/sample/runner.html](http://localhost:8080/components/polyperf/sample/runner.html). The results will look something like this:
16 | 
17 | <img width="469" alt="screen shot 2016-11-03 at 12 54 32" src="https://cloud.githubusercontent.com/assets/1369170/19982787/b20dee9e-a1c4-11e6-8d2b-d7f607eaeff9.png">
18 | 
19 | The tests are run by `runner.html`, which defines the list of tests to run. Edit `runner.html` to choose test pages to run, and how many times each test should be run. By default, each test runs 25 times, but you can configure it by changing the `frame-tester`'s `runs` attribute:
20 | 
21 | ```
22 | <frame-tester runs="25"></frame-tester>
23 | ```
24 | 
25 | There are two different ways to configure your tests:
26 | 
27 | ### Using the harness
28 | Use this approach if you want to test the cost of
29 | an element by repeating it a number of times on the page (by default: 250 times).
30 | 
31 | In `runner.html`, modify the array of tests in `document.querySelector('frame-tester').tests` as follows:
32 | 
33 | ```
34 | document.querySelector('frame-tester').tests = [
35 |   'harness.html?wc-element=input',
36 |   'harness.html?wc-element=test1-element&wc-path=./elements/test1-element.html',
37 |   'harness.html?wc-element=test2-element&wc-path=./elements/test2-element.html'
38 | ];
39 | ```
40 | 
41 | To test a native element (eg. `input`), use `wc-element=input`. To test a custom
42 | element, use `harness.html?wc-element=$name&wc-path=$path`, where `$name` is
43 | the name of the custom element (eg. `paper-input`), and `$path` is the path
44 | to where it lives (eg. `./elements/paper-input/paper-input.html`).
45 | 
46 | To configure the number of times the element is repeated in the page, use
47 | the `wc-count` argument:
48 | `harness.html?wc-element=$name&wc-path=$path&wc-count=17`
49 | 
50 | Note, the reported results are cummulative, i.e. how long the page with the repeated element took to run.
51 | 
52 | ### Using specific tests
53 | Use this approach if you want to repeat a custom test that does something
54 | more than just repeating an element in a page.
55 | 
56 | In `runner.html`, modify the array of tests in `document.querySelector('frame-tester').tests` as follows:
57 | 
58 | ```
59 | document.querySelector('frame-tester').tests = [
60 |   'test1.html',
61 |   'test2.html'
62 | ];
63 | ```
64 | 
65 | Where `test.1.html` is the specific webpage to test. Each test page should include
66 | 
67 | ```
68 | <script src="perf-lib/perf.js"></script>
69 | ```
70 | 
71 | and call
72 | 
73 | ```html
74 | <script>
75 |   console.perf();
76 | </script>
77 | ```
78 | 
79 | before the snippet of code to test, followed by
80 | 
81 | ```html
82 | <script>
83 |    console.perfEnd();
84 | </script>
85 | ```
86 | 
87 | after the snippet of code to test.
88 | 


--------------------------------------------------------------------------------
/bower.json:
--------------------------------------------------------------------------------
 1 | {
 2 |   "name": "polyperf",
 3 |   "version": "0.9.0",
 4 |   "license": "http://polymer.github.io/LICENSE.txt",
 5 |   "ignore": [
 6 |     "/.*",
 7 |     "/test/",
 8 |     "/util/",
 9 |     "/explainer/",
10 |     "/bower_components/",
11 |     "gulpfile.js",
12 |     "PRIMER.md",
13 |     "CONTRIBUTING.md",
14 |     "CHANGELOG.md"
15 |   ],
16 |   "authors": [
17 |     "The Polymer Authors (http://polymer.github.io/AUTHORS.txt)"
18 |   ],
19 |   "repository": {
20 |     "type": "git",
21 |     "url": "https://github.com/PolymerLabs/polyperf.git"
22 |   },
23 |   "dependencies": {
24 |     "polymer": "Polymer/polymer#^1.4.0"
25 |   },
26 |   "private": true
27 | }
28 | 


--------------------------------------------------------------------------------
/perf-lib/frame-tester.html:
--------------------------------------------------------------------------------
  1 |   <style>
  2 | 
  3 |     frame-tester {
  4 |       display: block;
  5 |       font-family: sans-serif;
  6 |       overflow: hidden;
  7 |     }
  8 | 
  9 |     frame-tester iframe {
 10 |       position: absolute;
 11 |       border: 0;
 12 |       width: 1920px;
 13 |       height: 1080px;
 14 |       left: -2000px;
 15 |       top: -2000px;
 16 |       visibility: hidden;
 17 |       xdisplay: none;
 18 |     }
 19 | 
 20 |     frame-tester o, frame-tester n {
 21 |       display: inline-block;
 22 |       xwidth: 24px;
 23 |       margin: 2px;
 24 |       text-align: right;
 25 |       font-family: monospace;
 26 |     }
 27 | 
 28 |     frame-tester o {
 29 |       color: rgba(255, 0, 0, 0.5);
 30 |     }
 31 | 
 32 |     frame-tester n {
 33 |       display: inline-block;
 34 |       color: green;
 35 |       font-weight: bold;
 36 |     }
 37 | 
 38 |     frame-tester .card {
 39 |       padding: 16px;
 40 |       box-shadow: 0 8px 10px 1px rgba(0, 0, 0, 0.14),
 41 |                   0 3px 14px 2px rgba(0, 0, 0, 0.12),
 42 |                   0 5px 5px -3px rgba(0, 0, 0, 0.4);
 43 |       margin: 16px;
 44 |       overflow: hidden;
 45 |       background-color: #fff;
 46 |     }
 47 | 
 48 |   </style>
 49 | 
 50 | <template>
 51 | 
 52 |   <div id="log"></div>
 53 | 
 54 |   <iframe id="frame"></iframe>
 55 | 
 56 | </template><script>
 57 | (function() {
 58 | 
 59 |   var proto = Object.create(HTMLElement.prototype);
 60 | 
 61 |   proto._template = document._currentScript.ownerDocument.querySelector('template');
 62 | 
 63 |   proto.createdCallback = function() {
 64 |     this.appendChild(document.importNode(this._template.content, true));
 65 |     this.frame = this.querySelector('#frame');
 66 |     this.log = this.querySelector('#log');
 67 |     this.strategy = this.strategies.minimum;
 68 |     this.attributeChangedCallback('runs', null, this.getAttribute('runs') || 25);
 69 |     this.attributeChangedCallback('base', null, this.getAttribute('base') || '');
 70 |     window.addEventListener('message', this.scoreMessage.bind(this));
 71 |   }
 72 | 
 73 |   proto.attributeChangedCallback = function(name, old, value) {
 74 |     switch(name) {
 75 |       case 'runs':
 76 |         this.runs = value;
 77 |         break;
 78 |       case 'base':
 79 |         this.base = value;
 80 |         break;
 81 |       case 'strategy':
 82 |         this.strategy = this.strategies[strategy] || this.strategy;
 83 |         break;
 84 |     }
 85 |   };
 86 | 
 87 |   var testing = {
 88 | 
 89 |     get tests() {
 90 |       return this._tests;
 91 |     },
 92 | 
 93 |     set tests(value) {
 94 |       this._tests = value;
 95 |       this.go();
 96 |     },
 97 | 
 98 |     shuffle: function(tests) {
 99 |       var shuffled = [];
100 |       var ordered = tests.slice(0);
101 |       var count = ordered.length;
102 |       for (var i=0, j; i<count; i++) {
103 |         j = Math.floor(Math.random()*count);
104 |         // TODO(sjmiles): this is an easy but poorly randomized distribution
105 |         for (; !ordered[j]; j = (j + 1) % count);
106 |         shuffled.push(j);
107 |         ordered[j] = null;
108 |       }
109 |       return shuffled;
110 |     },
111 | 
112 |     go: function() {
113 |       this.count = 0;
114 |       this.total = [];
115 |       this.times = [];
116 |       this.infos = [];
117 |       for (var i=0; i<this.tests.length; i++) {
118 |         this.total[i] = 0;
119 |         this.times[i] = [];
120 |       }
121 |       this.startRun();
122 |     },
123 | 
124 |     startRun: function() {
125 |       this.shuffled = this.shuffle(this.tests);
126 |       this.index = -1;
127 |       //console.group('run', this.count);
128 |       this.nextTest();
129 |     },
130 | 
131 |     nextTest: function() {
132 |       // last test in this run?
133 |       if (++this.index === this.tests.length) {
134 |         //console.groupEnd();
135 |         // report results
136 |         ++this.count;
137 |         this.report();
138 |         // more runs?
139 |         if (this.count < this.runs) {
140 |           this.startRun();
141 |         } else {
142 |           // all done!
143 |           this.dispatchEvent(new CustomEvent('done'));
144 |         }
145 |         return;
146 |       }
147 |       // test order is randomized
148 |       this.test = this.shuffled[this.index];
149 |       this.frame.src = this.base + this.tests[this.test];
150 |       // it's possible for a test to end before the load event fires,
151 |       // so assume the frame loads immediately and start waiting
152 |       // for a result.
153 |       this.load();
154 |     },
155 | 
156 |     load: function() {
157 |       // frame is loaded, measure the time, then proceed
158 |       this.measure(function(info) {
159 |         this.record(info);
160 |         this.nextTest();
161 |       });
162 |     },
163 | 
164 |     measure: function(next) {
165 |       this.afterScore = next;
166 |     },
167 | 
168 |     scoreMessage: function(e) {
169 |       if (this.afterScore) {
170 |         var info = e.data;
171 |         if (typeof info !== 'object') {
172 |           info = {time: info};
173 |         }
174 |         info.time = parseInt(info.time);
175 |         this.afterScore(info);
176 |       }
177 |     },
178 | 
179 |     record: function(info) {
180 |       //console.log('index [%d], test [%d] time [%d]', this.index, this.test, time);
181 |       if (!this.infos[this.test]) {
182 |         this.infos[this.test] = info;
183 |       }
184 |       this.times[this.test].push(info.time);
185 |       this.total[this.test] += info.time;
186 |     },
187 | 
188 |     report: function() {
189 |       var info = '<br>Runs: ' + this.count + '/' + this.runs
190 |         + '<br><br>';
191 |       //
192 |       for (var i=0; i<this.tests.length; i++) {
193 |         var url = this.tests[i],
194 |             total = this.total[i],
195 |             times = this.times[i],
196 |             testInfo = this.infos[i],
197 |             stats = this.stats(times);
198 |         //
199 |         var time = this.strategy.score(times, stats, this);
200 |         //
201 |         var title = (testInfo && testInfo.info && testInfo.info.name) || url;
202 |         info += '<div class="card">'
203 |           + ' <b>' + (time).toFixed(1) + 'ms' + '</b>'
204 |           //+ ' [stddev: ' + stats.deviation.toFixed(2) + ']'
205 |           + ' &nbsp;&nbsp;&nbsp;<a href="' + this.base + url + '" target="_blank">' + title + '</a>'
206 |           + '<br>'
207 |           ;
208 |         //
209 |         info += '<span style="font-size: 8px; white-space: nowrap">';
210 |         for (var j=0, v; v=times[j]; j++) {
211 |           var o = stats.outlier(v);
212 |           info += (o ? '<o>' : '<n>') + v.toFixed(0) + (o ? '</o>' : '</n>') + '|';
213 |         }
214 |         info += '</span>';
215 |         info += '</div>';
216 |       }
217 |       //
218 |       this.log.innerHTML = info;
219 |     },
220 | 
221 |     stats: function(a) {
222 |       var r = {mean: 0, variance: 0, deviation: 0}, t = a.length;
223 |       for (var m, s = 0, l = t; l--; s += a[l]);
224 |       for (m = r.mean = s / t, l = t, s = 0; l--; s += Math.pow(a[l] - m, 2));
225 |       r.outlier = this.strategy.outlier;
226 |       return r.deviation = Math.sqrt(r.variance = s / t), r;
227 |     },
228 | 
229 |     //
230 |     // selectable statical strategies
231 |     //
232 | 
233 |     strategies: {
234 | 
235 |       // This strategy selects the minimum timing for score.
236 |       minimum: {
237 |         score: function(times, stats) {
238 |           var min = Number.MAX_VALUE;
239 |           for (var j=0, v; v=times[j]; j++) {
240 |             min = Math.min(v, min);
241 |           }
242 |           stats.score = min;
243 |           return min;
244 |         },
245 |         // called in stats context
246 |         outlier: function(value) {
247 |           return value > this.score;
248 |         }
249 |       },
250 | 
251 |       // This strategy selects the mean of all times not more than one stddev
252 |       // away from the total sampling mean.
253 |       onedev: {
254 |         score: function(times, stats, context) {
255 |           var cleaned = [];
256 |           for (var j=0, v; v=times[j]; j++) {
257 |             if (!stats.outlier(v)) {
258 |               cleaned.push(v);
259 |             }
260 |           }
261 |           return context.stats(cleaned).mean;
262 |         },
263 |         // called in stats context
264 |         outlier: function(value) {
265 |           return Math.abs(value - this.mean) > (1 * this.deviation);
266 |         }
267 |       }
268 | 
269 |     }
270 | 
271 |   };
272 | 
273 |   for (var i in testing) {
274 |     Object.defineProperty(proto, i, Object.getOwnPropertyDescriptor(testing, i));
275 |   }
276 | 
277 |   document.registerElement('frame-tester', {prototype: proto});
278 | 
279 | })();
280 | </script>


--------------------------------------------------------------------------------
/perf-lib/perf.js:
--------------------------------------------------------------------------------
 1 | // x-browser compat.
 2 | if (!window.performance) {
 3 |   var start = Date.now();
 4 |   // only at millisecond precision
 5 |   window.performance = {now: function(){ return Date.now() - start }};
 6 | }
 7 | 
 8 | console.perf = function() {
 9 |   if (window.HTMLImports && !HTMLImports.useNative) {
10 |     var fn = console._perf.bind(console);
11 |     if (!CustomElements.ready) {
12 |       addEventListener('HTMLImportsLoaded', fn, true);
13 |     } else {
14 |       HTMLImports.whenReady(fn);
15 |     }
16 |   } else {
17 |     console._perf();
18 |   }
19 | };
20 | 
21 | console._perf = function() {
22 |   if (window.gc) {
23 |     for (var i=0; i<20; i++) {
24 |       gc();
25 |     }
26 |   }
27 |   if (console.time) {
28 |     console.time('perf');
29 |   }
30 |   console.profile();
31 |   console.perf.time = performance.now();
32 | };
33 | 
34 | console.perfEnd = function(info) {
35 |   // TODO(sorvell): WCR is unnecessarily delayed via setTimeout to workaround
36 |   // https://code.google.com/p/chromium/issues/detail?id=425790.
37 |   // This can add significant noise to benchmarking so avoid the wait
38 |   // if we know we can (native CE).
39 |   // We don't need the workaround for this use case because perfEnd is typically
40 |   // called via a blocking script.
41 |   if (window.WebComponents && !CustomElements.useNative) {
42 |     // TODO(sjmiles): we need some kind of 'whenReady' or other signal
43 |     // that will work if this function is called after the event has fired
44 |     if (!CustomElements.ready) {
45 |       addEventListener('WebComponentsReady', function() {
46 |         console._perfEnd(info);
47 |       });
48 |     } else {
49 |       CustomElements.takeRecords();
50 |       console._perfEnd(info);
51 |     }
52 |   } else {
53 |     console._perfEnd(info);
54 |   }
55 | };
56 | 
57 | console._perfEnd = function(info) {
58 |   // force layout
59 |   document.body.offsetWidth;
60 |   var time = performance.now() - console.perf.time;
61 |   console.profileEnd();
62 |   if (console.time) {
63 |     console.timeEnd('perf');
64 |   }
65 |   document.title = time.toFixed(1) + 'ms: ' + document.title;
66 |   if (window.top !== window) {
67 |     window.top.postMessage({time: time + 'ms', info: info}, '*');
68 |   }
69 | };
70 | 


--------------------------------------------------------------------------------
/sample/elements/test1-element.html:
--------------------------------------------------------------------------------
 1 | <!--
 2 | @license
 3 | Copyright (c) 2014 The Polymer Project Authors. All rights reserved.
 4 | This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
 5 | The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
 6 | The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
 7 | Code distributed by Google as part of the polymer project is also
 8 | subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
 9 | -->
10 | <link rel="import" href="../../bower_components/polymer/polymer.html">
11 | 
12 | <dom-module id="test1-element">
13 |   <template>
14 |     <style></style>
15 | 
16 |     Test Element 1
17 |   </template>
18 | </dom-module>
19 | 
20 | <script>
21 |   Polymer({
22 |     is: 'test1-element',
23 |     ready: function() {
24 |       for (var i=0; i<1000; i++) {
25 |         this.fire('foo-bar');
26 |       }
27 |     }
28 |   });
29 | </script>
30 | 


--------------------------------------------------------------------------------
/sample/elements/test2-element.html:
--------------------------------------------------------------------------------
 1 | <!--
 2 | @license
 3 | Copyright (c) 2014 The Polymer Project Authors. All rights reserved.
 4 | This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
 5 | The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
 6 | The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
 7 | Code distributed by Google as part of the polymer project is also
 8 | subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
 9 | -->
10 | <link rel="import" href="../../bower_components/polymer/polymer.html">
11 | 
12 | <dom-module id="test2-element">
13 |   <template>
14 |     <style></style>
15 | 
16 |     Test Element 2
17 |   </template>
18 | </dom-module>
19 | 
20 | <script>
21 |   Polymer({
22 |     is: 'test2-element',
23 |     ready: function() {
24 |       for (var i=0; i<3000; i++) {
25 |         this.fire('foo-bar');
26 |       }
27 |     }
28 |   });
29 | </script>
30 | 


--------------------------------------------------------------------------------
/sample/harness.html:
--------------------------------------------------------------------------------
 1 | <!doctype html>
 2 | <!--
 3 | @license
 4 | Copyright (c) 2016 The Polymer Project Authors. All rights reserved.
 5 | This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
 6 | The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
 7 | The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
 8 | Code distributed by Google as part of the polymer project is also
 9 | subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
10 | -->
11 | <html>
12 | <head>
13 |   <title>element tester</title>
14 |   <script src="../bower_components/webcomponentsjs/webcomponents-lite.js"></script>
15 |   <link rel="import" href="../bower_components/polymer/polymer.html">
16 |   <script src="../perf-lib/perf.js"></script>
17 | </head>
18 | <body>
19 | 
20 |   <script>
21 |     var elementName = WebComponents.flags.element;
22 |     var elementPath = WebComponents.flags.path || '';
23 |     var elementCount = Number(WebComponents.flags.count) || 250;
24 |     var testDoc;
25 | 
26 |     function test() {
27 |       var template = (testDoc && testDoc.querySelector('#test-template'))
28 |       if (!template) {
29 |         template = document.createElement('template');
30 |         var container = document.createElement('div');
31 |         container.appendChild(template.content.ownerDocument.createElement(elementName));
32 |         template.content.appendChild(container);
33 |       }
34 |       var container = document.createElement('div');
35 |       document.body.appendChild(container);
36 |       //
37 |       console.perf();
38 |       for (var i=0; i<elementCount; i++) {
39 |         document.body.appendChild(document.importNode(template.content, true));
40 |       }
41 |       var name = elementPath.split('/').pop()
42 |         .split('.').shift() || elementName;
43 |       console.perfEnd({name: name});
44 |     }
45 | 
46 |     if (elementName) {
47 |       if (elementPath) {
48 |         var link = document.createElement('link');
49 |         link.rel = 'import';
50 |         link.href = elementPath;
51 |         link.addEventListener('load', function(e) {
52 |           testDoc = e.target.import;
53 |           requestAnimationFrame(test);
54 |         });
55 |         document.head.appendChild(link);
56 |       } else {
57 |         requestAnimationFrame(test);
58 |       }
59 |     }
60 | 
61 |   </script>
62 | 
63 | </body>
64 | </html>
65 | 


--------------------------------------------------------------------------------
/sample/runner.html:
--------------------------------------------------------------------------------
 1 | <!doctype html>
 2 | <!--
 3 | @license
 4 | Copyright (c) 2016 The Polymer Project Authors. All rights reserved.
 5 | This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
 6 | The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
 7 | The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
 8 | Code distributed by Google as part of the polymer project is also
 9 | subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
10 | -->
11 | <html lang="en">
12 | <head>
13 | 
14 |   <meta charset="utf-8">
15 |   <script src="../bower_components/webcomponentsjs/webcomponents-lite.js"></script>
16 |   <link rel="import" href="../perf-lib/frame-tester.html">
17 | 	<style>
18 |     summary {
19 |       font-family: sans-serif;
20 |       font-size: 1.5em;
21 |     }
22 |   </style>
23 | 
24 | </head>
25 | <body>
26 | 
27 |   <summary>Element Tester</summary>
28 | 
29 |   <frame-tester runs="25"></frame-tester>
30 | 
31 |   <script>
32 | 
33 |   addEventListener('WebComponentsReady', function() {
34 |     document.querySelector('frame-tester').tests = [
35 |       // Use this approach to run specific tests.
36 |       //'test1.html',
37 |       //'test2.html',
38 | 
39 |       // Use this approach to test a specific element by repeating it in the page.
40 |       'harness.html?wc-element=input',  /* the native input element */
41 |       'harness.html?wc-element=test1-element&wc-path=./elements/test1-element.html',
42 |       'harness.html?wc-element=test2-element&wc-path=./elements/test2-element.html'
43 |     ];
44 |   });
45 |   </script>
46 | 
47 | </body>
48 | </html>
49 | 


--------------------------------------------------------------------------------
/sample/test1.html:
--------------------------------------------------------------------------------
 1 | <!doctype html>
 2 | <!--
 3 | @license
 4 | Copyright (c) 2014 The Polymer Project Authors. All rights reserved.
 5 | This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
 6 | The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
 7 | The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
 8 | Code distributed by Google as part of the polymer project is also
 9 | subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
10 | -->
11 | <html>
12 | <head>
13 |   <script src="../perf-lib/perf.js"></script>
14 |   <script src="../bower_components/webcomponentsjs/webcomponents-lite.js"></script>
15 |   <link rel="import" href="elements/test1-element.html">
16 | </head>
17 | 
18 | <body>
19 | 
20 |   <script>
21 |     console.perf();
22 |   </script>
23 | 
24 |   <test1-element></test1-element>
25 | 
26 |   <script>
27 |     console.perfEnd();
28 |   </script>
29 | 
30 | </body>
31 | </html>
32 | 


--------------------------------------------------------------------------------
/sample/test2.html:
--------------------------------------------------------------------------------
 1 | <!doctype html>
 2 | <!--
 3 | @license
 4 | Copyright (c) 2014 The Polymer Project Authors. All rights reserved.
 5 | This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
 6 | The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
 7 | The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
 8 | Code distributed by Google as part of the polymer project is also
 9 | subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
10 | -->
11 | <html>
12 | <head>
13 |   <script src="../perf-lib/perf.js"></script>
14 |   <script src="../bower_components/webcomponentsjs/webcomponents-lite.js"></script>
15 |   <link rel="import" href="elements/test2-element.html">
16 | </head>
17 | 
18 | <body>
19 | 
20 |   <script>
21 |     console.perf();
22 |   </script>
23 | 
24 |   <test2-element></test2-element>
25 | 
26 |   <script>
27 |     console.perfEnd();
28 |   </script>
29 | 
30 | </body>
31 | </html>
32 | 


--------------------------------------------------------------------------------