third_party/WebKit/PerformanceTests/CSS/StyleSheetInsert.html

   1 <!DOCTYPE html>
   2 <html>
   3 <head>
   4 <script src="../resources/runner.js"></script>
   5 </head>
   6 <body>
   7 <iframe></iframe>
   8 </body>
   9 <script>
  10
  11 function setup() {
  12     var frame = document.getElementsByTagName("iframe")[0];
  13     var testDoc = frame.contentDocument;
  14     var docText = "";
  15     docText += "<body><style>.foo {color:red}</style>";
  16     docText += "<div class='bar'>Foo</div>";
  17     for (var i = 0; i < 10000; ++i)
  18         docText += "<div class='foo'>Foo</div>";
  19     testDoc.body.innerHTML = docText;
  20     return testDoc;
  21 }
  22
  23 PerfTestRunner.measureTime({
  24     description: "Measures performance of inserting 50 large style elements into an iframe.",
  25     run:function() {
  26         var testDoc = setup();
  27         var start = PerfTestRunner.now();
  28         testDoc.body.offsetTop;
  29         for (var i = 0; i < 50; i++) {
  30             var styleElem = testDoc.createElement("style");
  31             styleElem.innerText = ".bar {color:green}";
  32             testDoc.body.insertBefore(styleElem, testDoc.body.firstChild);
  33         }
  34         testDoc.body.offsetTop;
  35         return PerfTestRunner.now() - start;
  36     }
  37 });
  38 </script>
  39 </html>