Worse animation performance on pages with 3D transforms
authorsimon.fraser@apple.com <simon.fraser@apple.com@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Fri, 18 Apr 2014 18:37:04 +0000 (18:37 +0000)
committersimon.fraser@apple.com <simon.fraser@apple.com@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Fri, 18 Apr 2014 18:37:04 +0000 (18:37 +0000)
https://bugs.webkit.org/show_bug.cgi?id=131838
<rdar://problem/16428630&15705876>

Reviewed by Dean Jackson.

Source/WebCore:
r155977 added logic to adjust the contentsScale of compositing layers
based on a root-relative transform. However, this resulted in
the contentsScale continually changing on layers whose transforms
are changed dynamically, which caused lots of expensive painting.

Fix by bucketing the part of the scale computed from the root-relative transform
into buckets of 0.25 via rounding.

Test: compositing/contents-scale/rounded-contents-scale.html

* platform/graphics/ca/GraphicsLayerCA.cpp:
(WebCore::clampedContentsScaleForScale):
(WebCore::GraphicsLayerCA::updateContentsOpaque):
(WebCore::GraphicsLayerCA::updateContentsScale):
(WebCore::GraphicsLayerCA::updateContentsVisibility): Deleted.
(WebCore::GraphicsLayerCA::animatedLayerClones): Deleted.

LayoutTests:
Testcase having layers at various z translates which shows the bucketing
of contentsScale, and fix results affected by the patch.

* compositing/contents-scale/rounded-contents-scale-expected.txt: Added.
* compositing/contents-scale/rounded-contents-scale.html: Added.
* compositing/contents-scale/z-translate-expected.txt:
* platform/mac-wk2/compositing/tiling/rotated-tiled-clamped-expected.txt:
* platform/mac-wk2/compositing/tiling/rotated-tiled-preserve3d-clamped-expected.txt:
* platform/mac/compositing/overflow/composited-scrolling-paint-phases-expected.txt:
* platform/mac/compositing/tiling/rotated-tiled-clamped-expected.txt:
* platform/mac/compositing/tiling/rotated-tiled-preserve3d-clamped-expected.txt:
* platform/mac/compositing/visible-rect/3d-transform-style-expected.txt:
* platform/mac/compositing/visible-rect/3d-transformed-expected.txt:
* platform/mac/compositing/visible-rect/nested-transform-expected.txt:

git-svn-id: https://svn.webkit.org/repository/webkit/trunk@167498 268f45cc-cd09-0410-ab3c-d52691b4dbfc

14 files changed:
LayoutTests/ChangeLog
LayoutTests/compositing/contents-scale/rounded-contents-scale-expected.txt [new file with mode: 0644]
LayoutTests/compositing/contents-scale/rounded-contents-scale.html [new file with mode: 0644]
LayoutTests/compositing/contents-scale/z-translate-expected.txt
LayoutTests/platform/mac-wk2/compositing/tiling/rotated-tiled-clamped-expected.txt
LayoutTests/platform/mac-wk2/compositing/tiling/rotated-tiled-preserve3d-clamped-expected.txt
LayoutTests/platform/mac/compositing/overflow/composited-scrolling-paint-phases-expected.txt
LayoutTests/platform/mac/compositing/tiling/rotated-tiled-clamped-expected.txt
LayoutTests/platform/mac/compositing/tiling/rotated-tiled-preserve3d-clamped-expected.txt
LayoutTests/platform/mac/compositing/visible-rect/3d-transform-style-expected.txt
LayoutTests/platform/mac/compositing/visible-rect/3d-transformed-expected.txt
LayoutTests/platform/mac/compositing/visible-rect/nested-transform-expected.txt
Source/WebCore/ChangeLog
Source/WebCore/platform/graphics/ca/GraphicsLayerCA.cpp

index 0d7125a..c4658d2 100644 (file)
@@ -1,3 +1,26 @@
+2014-04-18  Simon Fraser  <simon.fraser@apple.com>
+
+        Worse animation performance on pages with 3D transforms
+        https://bugs.webkit.org/show_bug.cgi?id=131838
+        <rdar://problem/16428630&15705876>
+
+        Reviewed by Dean Jackson.
+        
+        Testcase having layers at various z translates which shows the bucketing
+        of contentsScale, and fix results affected by the patch.
+
+        * compositing/contents-scale/rounded-contents-scale-expected.txt: Added.
+        * compositing/contents-scale/rounded-contents-scale.html: Added.
+        * compositing/contents-scale/z-translate-expected.txt:
+        * platform/mac-wk2/compositing/tiling/rotated-tiled-clamped-expected.txt:
+        * platform/mac-wk2/compositing/tiling/rotated-tiled-preserve3d-clamped-expected.txt:
+        * platform/mac/compositing/overflow/composited-scrolling-paint-phases-expected.txt:
+        * platform/mac/compositing/tiling/rotated-tiled-clamped-expected.txt:
+        * platform/mac/compositing/tiling/rotated-tiled-preserve3d-clamped-expected.txt:
+        * platform/mac/compositing/visible-rect/3d-transform-style-expected.txt:
+        * platform/mac/compositing/visible-rect/3d-transformed-expected.txt:
+        * platform/mac/compositing/visible-rect/nested-transform-expected.txt:
+
 2014-04-18  Radu Stavila  <stavila@adobe.com>
 
         [CSS Regions] Content overflowing a transformed region is clipped
diff --git a/LayoutTests/compositing/contents-scale/rounded-contents-scale-expected.txt b/LayoutTests/compositing/contents-scale/rounded-contents-scale-expected.txt
new file mode 100644 (file)
index 0000000..831d6d2
--- /dev/null
@@ -0,0 +1,77 @@
+(GraphicsLayer
+  (bounds 800.00 600.00)
+  (visible rect 0.00, 0.00 800.00 x 600.00)
+  (contentsScale 1.00)
+  (children 1
+    (GraphicsLayer
+      (bounds 800.00 600.00)
+      (contentsOpaque 1)
+      (visible rect 0.00, 0.00 800.00 x 600.00)
+      (contentsScale 1.00)
+      (children 1
+        (GraphicsLayer
+          (position 8.00 8.00)
+          (bounds 784.00 512.00)
+          (childrenTransform [1.00 0.00 0.00 0.00] [0.00 1.00 0.00 0.00] [0.78 0.51 1.00 -0.00] [0.00 0.00 0.00 1.00])
+          (visible rect 0.00, 0.00 784.00 x 512.00)
+          (contentsScale 1.00)
+          (children 6
+            (GraphicsLayer
+              (bounds 102.00 102.00)
+              (contentsOpaque 1)
+              (drawsContent 1)
+              (transform [1.00 0.00 0.00 0.00] [0.00 1.00 0.00 0.00] [0.00 0.00 1.00 0.00] [0.00 0.00 -200.00 1.00])
+              (visible rect 0.00, 0.00 102.00 x 102.00)
+              (contentsScale 0.75)
+            )
+            (GraphicsLayer
+              (position 0.00 82.00)
+              (bounds 102.00 102.00)
+              (contentsOpaque 1)
+              (drawsContent 1)
+              (transform [1.00 0.00 0.00 0.00] [0.00 1.00 0.00 0.00] [0.00 0.00 1.00 0.00] [0.00 0.00 -100.00 1.00])
+              (visible rect 0.00, 0.00 102.00 x 102.00)
+              (contentsScale 0.75)
+            )
+            (GraphicsLayer
+              (position 0.00 164.00)
+              (bounds 102.00 102.00)
+              (contentsOpaque 1)
+              (drawsContent 1)
+              (visible rect 0.00, 0.00 102.00 x 102.00)
+              (contentsScale 1.00)
+            )
+            (GraphicsLayer
+              (position 0.00 246.00)
+              (bounds 102.00 102.00)
+              (contentsOpaque 1)
+              (drawsContent 1)
+              (transform [1.00 0.00 0.00 0.00] [0.00 1.00 0.00 0.00] [0.00 0.00 1.00 0.00] [0.00 0.00 50.00 1.00])
+              (visible rect 0.00, 0.00 102.00 x 102.00)
+              (contentsScale 1.00)
+            )
+            (GraphicsLayer
+              (position 0.00 328.00)
+              (bounds 102.00 102.00)
+              (contentsOpaque 1)
+              (drawsContent 1)
+              (transform [1.00 0.00 0.00 0.00] [0.00 1.00 0.00 0.00] [0.00 0.00 1.00 0.00] [0.00 0.00 100.00 1.00])
+              (visible rect 0.00, 0.00 102.00 x 102.00)
+              (contentsScale 1.25)
+            )
+            (GraphicsLayer
+              (position 0.00 410.00)
+              (bounds 102.00 102.00)
+              (contentsOpaque 1)
+              (drawsContent 1)
+              (transform [1.00 0.00 0.00 0.00] [0.00 1.00 0.00 0.00] [0.00 0.00 1.00 0.00] [0.00 0.00 150.00 1.00])
+              (visible rect 0.00, 0.00 102.00 x 4.40)
+              (contentsScale 1.50)
+            )
+          )
+        )
+      )
+    )
+  )
+)
+
diff --git a/LayoutTests/compositing/contents-scale/rounded-contents-scale.html b/LayoutTests/compositing/contents-scale/rounded-contents-scale.html
new file mode 100644 (file)
index 0000000..1688530
--- /dev/null
@@ -0,0 +1,40 @@
+<!DOCTYPE html>
+
+<html>
+<head>
+    <style>
+        body {
+            -webkit-perspective: 500px;
+            -webkit-perspective-origin: top left;
+        }
+        
+        .box {
+            height: 100px;
+            width: 100px;
+            margin-bottom: -20px;
+            background-color: silver;
+            border: 1px solid black;
+        }
+    </style>
+    <script>
+        if (window.testRunner)
+            testRunner.dumpAsText();
+
+        function doTest()
+        {
+            if (window.internals)
+                document.getElementById('layers').innerText = internals.layerTreeAsText(document, internals.LAYER_TREE_INCLUDES_VISIBLE_RECTS)
+        }
+        window.addEventListener('load', doTest, false);
+    </script>
+</head>
+<body>
+    <div class="box" style="-webkit-transform: translateZ(-200px)"></div>
+    <div class="box" style="-webkit-transform: translateZ(-100px)"></div>
+    <div class="box" style="-webkit-transform: translateZ(0)"></div>
+    <div class="box" style="-webkit-transform: translateZ(50px)"></div>
+    <div class="box" style="-webkit-transform: translateZ(100px)"></div>
+    <div class="box" style="-webkit-transform: translateZ(150px)"></div>
+<pre id="layers"></pre>
+</body>
+</html>
index 13be723..e8b79f5 100644 (file)
@@ -36,7 +36,7 @@ Box
                   (drawsContent 1)
                   (transform [1.00 0.00 0.00 0.00] [0.00 1.00 0.00 0.00] [0.00 0.00 1.00 0.00] [0.00 0.00 100.00 1.00])
                   (visible rect 0.00, 0.00 100.00 x 100.00)
-                  (contentsScale 1.67)
+                  (contentsScale 1.75)
                 )
               )
             )
index 31424dd..9aaac9d 100644 (file)
@@ -34,8 +34,8 @@
                   (drawsContent 1)
                   (transform [0.17 0.00 -0.98 0.00] [0.00 1.00 0.00 0.00] [0.98 0.00 0.17 0.00] [0.00 0.00 0.00 1.00])
                   (visible rect 0.00, 0.00 2800.00 x 300.00)
-                  (contentsScale 0.85)
-                  (tile cache coverage 0, 0 2799 x 299)
+                  (contentsScale 0.75)
+                  (tile cache coverage 0, 0 2800 x 300)
                   (tile size 512 x 512)
                   (top left tile 0, 0 tiles grid 5 x 1)
                 )
index 1f01183..43ab056 100644 (file)
@@ -40,8 +40,8 @@
                       (drawsContent 1)
                       (transform [0.17 0.00 -0.98 0.00] [0.00 1.00 0.00 0.00] [0.98 0.00 0.17 0.00] [0.00 0.00 0.00 1.00])
                       (visible rect 0.00, 0.00 2800.00 x 300.00)
-                      (contentsScale 0.85)
-                      (tile cache coverage 0, 0 2799 x 299)
+                      (contentsScale 0.75)
+                      (tile cache coverage 0, 0 2800 x 300)
                       (tile size 512 x 512)
                       (top left tile 0, 0 tiles grid 5 x 1)
                     )
index 3696fc7..825b21f 100644 (file)
@@ -45,6 +45,7 @@
                     (GraphicsLayer
                       (position 0.00 10.00)
                       (bounds 80.00 10.00)
+                      (contentsOpaque 1)
                       (paintingPhases
                         GraphicsLayerPaintBackground
                         GraphicsLayerPaintForeground
index 4adf17f..dad9d53 100644 (file)
@@ -31,8 +31,8 @@
                   (drawsContent 1)
                   (transform [0.17 0.00 -0.98 0.00] [0.00 1.00 0.00 0.00] [0.98 0.00 0.17 0.00] [0.00 0.00 0.00 1.00])
                   (visible rect 0.00, 0.00 2800.00 x 300.00)
-                  (contentsScale 0.85)
-                  (tile cache coverage 0, 0 2799 x 299)
+                  (contentsScale 0.75)
+                  (tile cache coverage 0, 0 2800 x 300)
                   (tile size 512 x 512)
                   (top left tile 0, 0 tiles grid 5 x 1)
                 )
index ffebcde..4bdab52 100644 (file)
@@ -37,8 +37,8 @@
                       (drawsContent 1)
                       (transform [0.17 0.00 -0.98 0.00] [0.00 1.00 0.00 0.00] [0.98 0.00 0.17 0.00] [0.00 0.00 0.00 1.00])
                       (visible rect 0.00, 0.00 2800.00 x 300.00)
-                      (contentsScale 0.85)
-                      (tile cache coverage 0, 0 2799 x 299)
+                      (contentsScale 0.75)
+                      (tile cache coverage 0, 0 2800 x 300)
                       (tile size 512 x 512)
                       (top left tile 0, 0 tiles grid 5 x 1)
                     )
index 4dae9d2..73b9f20 100644 (file)
@@ -33,7 +33,7 @@
                       (contentsOpaque 1)
                       (transform [1.00 0.00 0.00 0.00] [0.00 0.91 0.42 0.00] [0.00 -0.42 0.91 0.00] [0.00 0.00 0.00 1.00])
                       (visible rect 0.00, 0.00 213.67 x 200.68)
-                      (contentsScale 0.93)
+                      (contentsScale 1.00)
                     )
                   )
                 )
@@ -65,7 +65,7 @@
                       (contentsOpaque 1)
                       (transform [0.91 0.00 0.42 0.00] [0.00 1.00 0.00 0.00] [-0.42 0.00 0.91 0.00] [0.00 0.00 0.00 1.00])
                       (visible rect 0.00, 0.00 200.68 x 213.67)
-                      (contentsScale 0.92)
+                      (contentsScale 1.00)
                     )
                   )
                 )
index 00a7de4..36b3388 100644 (file)
@@ -28,7 +28,7 @@
                   (contentsOpaque 1)
                   (transform [1.00 0.00 0.00 0.00] [0.00 0.71 0.71 0.00] [0.00 -0.71 0.71 0.00] [0.00 0.00 0.00 1.00])
                   (visible rect 0.00, 0.00 220.62 x 218.46)
-                  (contentsScale 0.92)
+                  (contentsScale 1.00)
                 )
               )
             )
@@ -53,7 +53,7 @@
                   (contentsOpaque 1)
                   (transform [0.71 0.00 0.71 0.00] [0.00 1.00 0.00 0.00] [-0.71 0.00 0.71 0.00] [0.00 0.00 0.00 1.00])
                   (visible rect 0.00, 0.00 218.46 x 220.62)
-                  (contentsScale 0.91)
+                  (contentsScale 1.00)
                 )
               )
             )
index 56ba47f..88499e3 100644 (file)
                   (preserves3D 1)
                   (transform [0.94 0.00 -0.34 0.00] [0.00 1.00 0.00 0.00] [0.34 0.00 0.94 0.00] [0.00 0.00 0.00 1.00])
                   (visible rect 0.00, 0.00 0.00 x 0.00)
-                  (contentsScale 1.21)
+                  (contentsScale 1.25)
                   (children 1
                     (GraphicsLayer
                       (bounds 300.00 0.00)
                       (preserves3D 1)
                       (transform [0.94 0.00 -0.34 0.00] [0.00 1.00 0.00 0.00] [0.34 0.00 0.94 0.00] [0.00 0.00 0.00 1.00])
                       (visible rect 0.00, 0.00 0.00 x 0.00)
-                      (contentsScale 1.44)
+                      (contentsScale 1.50)
                       (children 1
                         (GraphicsLayer
                           (bounds 500.00 500.00)
                           (contentsOpaque 1)
                           (transform [1.00 0.00 0.00 0.00] [0.00 0.82 0.57 0.00] [0.00 -0.57 0.82 0.00] [0.00 0.00 0.00 1.00])
                           (visible rect 0.00, 0.00 500.00 x 369.91)
-                          (contentsScale 1.05)
+                          (contentsScale 1.00)
                         )
                       )
                     )
                       (preserves3D 1)
                       (transform [0.77 0.00 -0.64 0.00] [0.00 1.00 0.00 0.00] [0.64 0.00 0.77 0.00] [0.00 0.00 0.00 1.00])
                       (visible rect 0.00, 0.00 0.00 x 0.00)
-                      (contentsScale 1.64)
+                      (contentsScale 1.75)
                       (children 1
                         (GraphicsLayer
                           (bounds 500.00 500.00)
                           (contentsOpaque 1)
                           (transform [1.00 0.00 0.00 0.00] [0.00 0.82 0.57 0.00] [0.00 -0.57 0.82 0.00] [0.00 0.00 0.00 1.00])
                           (visible rect 0.00, 0.00 500.00 x 351.87)
-                          (contentsScale 1.20)
+                          (contentsScale 1.25)
                         )
                       )
                     )
index fb6f5d6..b92d217 100644 (file)
@@ -1,5 +1,30 @@
 2014-04-18  Simon Fraser  <simon.fraser@apple.com>
 
+        Worse animation performance on pages with 3D transforms
+        https://bugs.webkit.org/show_bug.cgi?id=131838
+        <rdar://problem/16428630&15705876>
+
+        Reviewed by Dean Jackson.
+        
+        r155977 added logic to adjust the contentsScale of compositing layers
+        based on a root-relative transform. However, this resulted in
+        the contentsScale continually changing on layers whose transforms
+        are changed dynamically, which caused lots of expensive painting.
+        
+        Fix by bucketing the part of the scale computed from the root-relative transform
+        into buckets of 0.25 via rounding.
+
+        Test: compositing/contents-scale/rounded-contents-scale.html
+
+        * platform/graphics/ca/GraphicsLayerCA.cpp:
+        (WebCore::clampedContentsScaleForScale):
+        (WebCore::GraphicsLayerCA::updateContentsOpaque):
+        (WebCore::GraphicsLayerCA::updateContentsScale):
+        (WebCore::GraphicsLayerCA::updateContentsVisibility): Deleted.
+        (WebCore::GraphicsLayerCA::animatedLayerClones): Deleted.
+
+2014-04-18  Simon Fraser  <simon.fraser@apple.com>
+
         Remove some includes from image-related headers, and Document.h
         https://bugs.webkit.org/show_bug.cgi?id=131797
 
index b558851..4e5db8c 100644 (file)
@@ -87,12 +87,19 @@ static inline bool isIntegral(float value)
     return static_cast<int>(value) == value;
 }
 
-static float clampedContentsScaleForScale(float scale)
+static float clampedContentsScaleForScale(float rootRelativeScale, float fixedScale)
 {
-    // Define some limits as a sanity check for the incoming scale value
-    // those too small to see.
-    const float maxScale = 10.0f;
+    // To avoid too many repaints when the root-relative scale of layers changes, round
+    // the scale to the nearest 0.25.
+    const float roundingFactor = 4;
+    float scale = roundf(rootRelativeScale * roundingFactor) / roundingFactor;
+
+    scale *= fixedScale;
+    
+    // Define some reasonable limits.
+    const float maxScale = 8;
     const float minScale = 0.01f;
+
     return std::max(minScale, std::min(scale, maxScale));
 }
 
@@ -1691,7 +1698,7 @@ void GraphicsLayerCA::updateContentsOpaque(float pageScaleFactor)
 {
     bool contentsOpaque = m_contentsOpaque;
     if (contentsOpaque) {
-        float contentsScale = clampedContentsScaleForScale(m_rootRelativeScaleFactor * pageScaleFactor * deviceScaleFactor());
+        float contentsScale = clampedContentsScaleForScale(m_rootRelativeScaleFactor, pageScaleFactor * deviceScaleFactor());
         if (!isIntegral(contentsScale) && !m_client->paintsOpaquelyAtNonIntegralScales(this))
             contentsOpaque = false;
     }
@@ -2981,7 +2988,7 @@ GraphicsLayerCA::LayerMap* GraphicsLayerCA::animatedLayerClones(AnimatedProperty
 
 void GraphicsLayerCA::updateContentsScale(float pageScaleFactor)
 {
-    float contentsScale = clampedContentsScaleForScale(m_rootRelativeScaleFactor * pageScaleFactor * deviceScaleFactor());
+    float contentsScale = clampedContentsScaleForScale(m_rootRelativeScaleFactor, pageScaleFactor * deviceScaleFactor());
 
     if (m_isPageTiledBackingLayer && tiledBacking()) {
         float zoomedOutScale = m_client->zoomedOutPageScaleFactor() * deviceScaleFactor();