Title: [286108] trunk/PerformanceTests
Revision
286108
Author
cathiec...@igalia.com
Date
2021-11-21 19:06:33 -0800 (Sun, 21 Nov 2021)

Log Message

[Performance test][css-contain] Add case to test contain: layout inside a complex document
https://bugs.webkit.org/show_bug.cgi?id=232883

Reviewed by Rob Buis.

This case test the performance of changing the content of a layout containment which is
inside a complex document.

* Layout/css-contain-layout-size-inside-complex-document.html: Added.

Modified Paths

Added Paths

Diff

Modified: trunk/PerformanceTests/ChangeLog (286107 => 286108)


--- trunk/PerformanceTests/ChangeLog	2021-11-21 23:58:55 UTC (rev 286107)
+++ trunk/PerformanceTests/ChangeLog	2021-11-22 03:06:33 UTC (rev 286108)
@@ -1,3 +1,15 @@
+2021-11-21  Cathie Chen  <cathiec...@igalia.com>
+
+        [Performance test][css-contain] Add case to test contain: layout inside a complex document
+        https://bugs.webkit.org/show_bug.cgi?id=232883
+
+        Reviewed by Rob Buis.
+
+        This case test the performance of changing the content of a layout containment which is
+        inside a complex document.
+
+        * Layout/css-contain-layout-size-inside-complex-document.html: Added.
+
 2021-11-19  Alan Bujtas  <za...@apple.com>
 
         Add layout performance test for simple bidi content

Added: trunk/PerformanceTests/Layout/css-contain-layout-size-inside-complex-document.html (0 => 286108)


--- trunk/PerformanceTests/Layout/css-contain-layout-size-inside-complex-document.html	                        (rev 0)
+++ trunk/PerformanceTests/Layout/css-contain-layout-size-inside-complex-document.html	2021-11-22 03:06:33 UTC (rev 286108)
@@ -0,0 +1,85 @@
+<!DOCTYPE html>
+<title>Performance test changing "contain: layout size" box inside a document with complicated and expensive layout</title>
+<style>
+#wrapper {
+    display: flex;
+    flex-direction: column;
+}
+.row {
+    display: flex;
+}
+#target {   
+    contain: layout size;
+}
+
+</style>
+<script src=""
+<pre id="log"></pre>
+<div id="wrapper"></div>
+<script>
+    let wrapper = document.getElementById("wrapper");
+    let target = undefined;
+
+    const NUM_ROWS = 10;
+    const DOM_DEPTH = 100;
+    function createCells(depth) {
+        let content = document.createElement("div");
+        if (!target) {
+            target = document.createElement("div");
+            target.id = "target";
+            content.appendChild(target);
+        }
+        content.appendChild(document.createElement("h1"));
+        content.appendChild(document.createElement("paragraph"));
+
+        if (depth > 0)
+            content.appendChild(createCells(depth - 1));
+
+        return content;
+    }
+
+    function generateContent() {
+        for (let i = 0; i < NUM_ROWS; i++) {
+            let row = document.createElement("div");
+            row.classList.add("row");
+            row.appendChild(createCells(DOM_DEPTH));
+            wrapper.appendChild(row);
+        }
+    }
+
+    function addTextToTarget() {
+        for (let i = 0; i < 5; i++) {
+            let textNode = document.createElement("div");
+            textNode.innerHTML = "some text";
+            target.appendChild(textNode);
+        }
+    }
+
+    function removeTextFromTarget() {
+        while (target.firstElementChild)
+            target.removeChild(target.firstElementChild);
+    }
+
+    function runTest() {
+        addTextToTarget();
+        document.body.getBoundingClientRect();
+        removeTextFromTarget();
+        document.body.getBoundingClientRect();
+    }
+
+    function setupTest() {
+        generateContent();
+        document.body.getBoundingClientRect();
+        PerfTestRunner.measureRunsPerSecond({
+            description: 'Measures performance of changing contain: layout size box inside a document with complicated and expensive layout.',
+            run: function () {
+                runTest();
+            },
+            done: function() {
+                wrapper.innerHTML = "";
+            }
+        });
+    }
+    window.requestAnimationFrame(setupTest);
+
+</script>
_______________________________________________
webkit-changes mailing list
webkit-changes@lists.webkit.org
https://lists.webkit.org/mailman/listinfo/webkit-changes

Reply via email to