link_invalidation_document_rules.html

<!--
This tests the overhead added by document rules to style recalc with display
locked elements. It adds 1,000 display-locked divs (with 4 links each), applies
and removes the lock, and forces a style update after. This test can be run with
and without "SpeculationRulesDocumentRulesSelectorMatches" enabled, and the
performance should be comparable.
-->
<!DOCTYPE html>
<head>
  <script src="../resources/runner.js"></script>
  <style>
    #root > * { content-visibility: visible; }
  </style>
  <script type="speculationrules">
    {"prefetch": [{"source": "document"}]}
  </script>
</head>
<body>
  <div id="root"></div>
</body>
<script>
  const NUM_BLOCKS = 1000;

  function setup() {
    let id = 0;
    root.innerHTML = "";
    document.styleSheets[0].rules[0].style.contentVisibility = 'visible';

    for (let i = 0; i < NUM_BLOCKS; i++) {
      const block = document.createElement("div");
      block.id = ++id;
      block.innerHTML = `
          <a href="/foo.com" id="${++id}">${id}</a>
          <a href="/foo.com" id="${++id}">${id}</a>
          <a href="/foo.com" id="${++id}">${id}</a>
          <a href="/foo.com" id="${++id}">${id}</a>
      `
      root.appendChild(block);
    }
    root.offsetLeft;
  }

  function runTest() {
    document.styleSheets[0].rules[0].style.contentVisibility = 'hidden';
    root.offsetTop;

    document.styleSheets[0].rules[0].style.contentVisibility = 'visible';
    root.offsetTop;
  }

  PerfTestRunner.measureTime({
    setup: setup,
    run: runTest,
    iterationCount: 10,
  });
</script>
chromium/third_party/blink/perf_tests/display_locking/link_invalidation_document_rules.html
