PerformanceTests/ShadowDOM/ShadowReprojection.html - WebKit - Git at Google

 <!DOCTYPE html>
 <html>
 <head>
     <script type="text/javascript" src="../resources/runner.js"></script>
 </head>
 <body>

 <div id="wrapper">
     <div id="host"></div>
 </div>

 <script>
 var numDivsInHost = 100;
 var nLoops = 1000;

 function setup()
 {
     var nDivs = numDivsInHost;

     for (var i = 0; i < nDivs; ++i) {
         var div = document.createElement('div');
         div.appendChild(document.createTextNode('div' + i));
         if (i % 2 == 0)
             div.className = 'selected';
         host.appendChild(div);
     }

     var shadowRoot = host.webkitCreateShadowRoot();
     shadowRoot.innerHTML = '<div id="host2"><shadow></shadow></div>';

     var host2 = shadowRoot.getElementById('host2');
     var shadowRoot2 = host2.webkitCreateShadowRoot();
     shadowRoot2.innerHTML = '<content select=".selected"></content>';
 }

 function run()
 {
     var host = document.getElementById('host');
     var nLoops = window.nLoops;

     var div = document.createElement('div');
     for (var i = 0; i < nLoops; ++i) {
         host.appendChild(div);
         host.removeChild(div);
         host.offsetLeft;
     }
 }

 function done()
 {
     wrapper.innerHTML = '';
 }

 setup();

 PerfTestRunner.measureTime({
     description: "Measure performance of shadow reprojection and distribution",
     run: run,
     done: done
 });
 </script>
 </body>
 </html>
	<!DOCTYPE html>
	<html>
	<head>
	<script type="text/javascript" src="../resources/runner.js"></script>
	</head>
	<body>

	<div id="wrapper">
	<div id="host"></div>
	</div>

	<script>
	var numDivsInHost = 100;
	var nLoops = 1000;

	function setup()
	{
	var nDivs = numDivsInHost;

	for (var i = 0; i < nDivs; ++i) {
	var div = document.createElement('div');
	div.appendChild(document.createTextNode('div' + i));
	if (i % 2 == 0)
	div.className = 'selected';
	host.appendChild(div);
	}

	var shadowRoot = host.webkitCreateShadowRoot();
	shadowRoot.innerHTML = '<div id="host2"><shadow></shadow></div>';

	var host2 = shadowRoot.getElementById('host2');
	var shadowRoot2 = host2.webkitCreateShadowRoot();
	shadowRoot2.innerHTML = '<content select=".selected"></content>';
	}

	function run()
	{
	var host = document.getElementById('host');
	var nLoops = window.nLoops;

	var div = document.createElement('div');
	for (var i = 0; i < nLoops; ++i) {
	host.appendChild(div);
	host.removeChild(div);
	host.offsetLeft;
	}
	}

	function done()
	{
	wrapper.innerHTML = '';
	}

	setup();

	PerfTestRunner.measureTime({
	description: "Measure performance of shadow reprojection and distribution",
	run: run,
	done: done
	});
	</script>
	</body>
	</html>