LayoutTests/perf/show-hide-table-rows.html - WebKit - Git at Google

 <style>
 .hidden { display: none; }
 </style>
 <script src="../resources/magnitude-perf.js"></script>
 <body>
 <div></div>
 <script>

 function setupFunction(magnitude)
 {
     var html = '<table>';
     for (var i = 0; i < magnitude; ++i)
         html += '<tr><td>A</td><td>B</td><td>C</td><td>D</td><td>E</td><td>F</td></tr>\n';
     html += '</table>';
     document.querySelector('div').innerHTML = html;
 }

 function forEachRow(what)
 {
     Array.prototype.forEach.call(document.querySelectorAll("tr"), what);
 }

 function test(magnitude)
 {
     forEachRow(function(tr) {
         tr.className = 'hidden';
     });
     document.body.offsetWidth;
     forEachRow(function(tr) {
         tr.className = '';
     });
     document.body.offsetWidth;
 }

 Magnitude.description("Tests that hiding/showing of table rows is linear.");
 Magnitude.millisecondsPerIteration = 100;
 Magnitude.run(setupFunction, test, Magnitude.LINEAR);
 document.querySelector('div').textContent = '';
 </script>
 </body>
	<style>
	.hidden { display: none; }
	</style>
	<script src="../resources/magnitude-perf.js"></script>
	<body>
	<div></div>
	<script>

	function setupFunction(magnitude)
	{
	var html = '<table>';
	for (var i = 0; i < magnitude; ++i)
	html += '<tr><td>A</td><td>B</td><td>C</td><td>D</td><td>E</td><td>F</td></tr>\n';
	html += '</table>';
	document.querySelector('div').innerHTML = html;
	}

	function forEachRow(what)
	{
	Array.prototype.forEach.call(document.querySelectorAll("tr"), what);
	}

	function test(magnitude)
	{
	forEachRow(function(tr) {
	tr.className = 'hidden';
	});
	document.body.offsetWidth;
	forEachRow(function(tr) {
	tr.className = '';
	});
	document.body.offsetWidth;
	}

	Magnitude.description("Tests that hiding/showing of table rows is linear.");
	Magnitude.millisecondsPerIteration = 100;
	Magnitude.run(setupFunction, test, Magnitude.LINEAR);
	document.querySelector('div').textContent = '';
	</script>
	</body>