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 <h2>Selected</h2> 10 <div id="selected"></div> 11 <h2>NonSelected</h2> 12 <div id="nonselected"></div> 13 </div> 14 15 <script> 16 var numDivsInHost = 100; 17 var typeNames = ['A', 'B', 'C']; 18 var array = new Array(numDivsInHost); 19 20 function setup() 21 { 22 var nDivs = numDivsInHost; 23 var nonSelected = document.getElementById('nonselected'); 24 25 for (var i = 0; i < nDivs; ++i) { 26 var div = document.createElement('div'); 27 div.appendChild(document.createTextNode('div' + i)); 28 div.className = typeNames[i % typeNames.length] 29 array[i] = div; 30 nonSelected.appendChild(div); 31 } 32 } 33 34 function run() 35 { 36 var nDivs = numDivsInHost; 37 var array = window.array; 38 39 var selected = document.getElementById('selected'); 40 var nonSelected = document.getElementById('nonselected'); 41 42 for (var i = 0; i < 100; ++i) { 43 for (var j = 0; j < typeNames.length; ++j) { 44 for (var k = 0; k < nDivs; ++k) { 45 if (array[k].className == typeNames[j]) 46 selected.appendChild(array[k]); 47 else 48 nonSelected.appendChild(array[k]); 49 } 50 selected.offsetLeft; 51 nonSelected.offsetLeft; 52 } 53 } 54 } 55 56 function done() 57 { 58 wrapper.innerHTML = ''; 59 } 60 61 setup(); 62 63 PerfTestRunner.measureTime({ 64 description: "Measure distribution and layout performance when we do the almost same thing as select attribute of content element is changed using JavaScript", 65 run: run, 66 done: done 67 }); 68 </script> 69 </body> 70 </html> 71
