1 <!doctype html> 2 <script src="../resources/runner.js"></script> 3 <script> 4 var listSize = 1000; 5 window.onload = function() { 6 PerfTestRunner.measureTime({ 7 run: function() { 8 var list = document.querySelector('#list'); 9 var tmpl = document.querySelector("#tmpl"); 10 list.innerHTML = ''; 11 var start = PerfTestRunner.now(); 12 var i = 0; 13 do { 14 var host = document.createElement('div'); 15 var root = host.createShadowRoot(); 16 root.appendChild(tmpl.content.cloneNode(true)); 17 var light = document.createElement('div'); 18 list.appendChild(host); 19 } while (++i < listSize); 20 21 document.body.offsetHeight; 22 return PerfTestRunner.now() - start; 23 } 24 }); 25 } 26 </script> 27 <template id="tmpl"> 28 <style> 29 @media (max-width: 600px) { 30 div { color: red; } 31 } 32 .foo { color: black; } 33 .bar { color: blue; } 34 .baz { color: green; } 35 .bat { color: orange; } 36 </style> 37 <div>item</div> 38 </template> 39 <section id="list"></section> 40