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> 16var numDivsInHost = 100; 17var typeNames = ['A', 'B', 'C']; 18var array = new Array(numDivsInHost); 19 20function 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 34function 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 56function done() 57{ 58 wrapper.innerHTML = ''; 59} 60 61setup(); 62 63PerfTestRunner.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