1 <!DOCTYPE html> 2 <html> 3 <head> 4 <script type="text/javascript" src="../resources/runner.js"></script> 5 </head> 6 <body> 7 8 <div id="wrapper"> 9 <div id="host"></div> 10 </div> 11 12 <script> 13 var numDivsInHost = 100; 14 var array = new Array(numDivsInHost); 15 16 function setup() 17 { 18 var nDivs = numDivsInHost; 19 20 window.shadowRoot = host.webkitCreateShadowRoot(); 21 shadowRoot.innerHTML = '<h2>Selected</h2><div id="selected"><content select=".selected"></content></div><h2>NonSelected</h2><div id="nonselected"><content></content></div>'; 22 23 for (var i = 0; i < nDivs; ++i) { 24 var div = document.createElement('div'); 25 div.appendChild(document.createTextNode('div' + i)); 26 host.appendChild(div); 27 array[i] = div; 28 } 29 } 30 31 function run() 32 { 33 var nDivs = numDivsInHost; 34 var array = window.array; 35 36 var selected = shadowRoot.getElementById('selected'); 37 var nonSelected = shadowRoot.getElementById('nonselected'); 38 39 for (var i = 2; i < 100; ++i) { 40 for (var j = 0; j < nDivs; ++j) 41 array[j].className = (j % i == 0) ? 'selected' : ''; 42 selected.offsetLeft; 43 nonSelected.offsetLeft; 44 } 45 } 46 47 function done() 48 { 49 wrapper.innerHTML = ''; 50 } 51 52 53 setup(); 54 55 PerfTestRunner.measureTime({ 56 description: "Measure distribution and layout performance when className is changed", 57 run: run, 58 done: done 59 }); 60 </script> 61 </body> 62 </html> 63
