third_party/WebKit/PerformanceTests/ShadowDOM/DistributionWithMultipleShadowRoots.html

   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 numShadowRoots = 20;
  14 var numDivsInHost = 10;
  15 var nLoops = 300;
  16
  17 function setup()
  18 {
  19     var nDivs = numDivsInHost;
  20
  21     for (var i = 0; i < nDivs; ++i) {
  22         var div = document.createElement('div');
  23         div.appendChild(document.createTextNode('div' + i));
  24         host.appendChild(div);
  25     }
  26
  27     for (var i = 0; i < numShadowRoots; ++i) {
  28         var shadow = document.createElement('shadow');
  29         var content = document.createElement('content');
  30         shadow.appendChild(content);
  31         var shadowRoot = host.createShadowRoot();
  32         shadowRoot.appendChild(shadow);
  33     }
  34 }
  35
  36 function run()
  37 {
  38     var host = document.getElementById('host');
  39     var nLoops = window.nLoops;
  40
  41     var div = document.createElement('div');
  42     for (var i = 0; i < nLoops; ++i) {
  43         host.appendChild(div);
  44         host.removeChild(div);
  45         PerfTestRunner.forceLayoutOrFullFrame();
  46     }
  47 }
  48
  49 function done()
  50 {
  51     wrapper.innerHTML = '';
  52 }
  53
  54
  55 setup();
  56
  57 PerfTestRunner.measureTime({
  58     description: "Measure Distribution and Layout time in a case there are multiple ShadowRoots",
  59     run: run,
  60     done: done
  61 });
  62 </script>
  63 </body>
  64 </html>