[Webkit-unassigned] [Bug 98177] New: Needless repaints at the beginning and end of a transition of a translate3d.

[bugzilla-daemon at webkit.org]

https://bugs.webkit.org/show_bug.cgi?id=98177

           Summary: Needless repaints at the beginning and end of a
                    transition of a translate3d.
           Product: WebKit
           Version: 528+ (Nightly build)
          Platform: All
        OS/Version: All
            Status: UNCONFIRMED
          Severity: Normal
          Priority: P2
         Component: Layout and Rendering
        AssignedTo: webkit-unassigned at lists.webkit.org
        ReportedBy: johnbarr at google.com


Created an attachment (id=166716)
 --> (https://bugs.webkit.org/attachment.cgi?id=166716&action=review)
composite layer demo

Chrome Version       : 24.0.1272.0 canary
OS Version: OS X 10.8.1
URLs (if applicable) : See attachment.
Other browsers tested:
  Add OK or FAIL after other browsers where you have tested this issue:
     Safari Version 6.0 (8536.25): FAIL (observed through "Timelines" -> "Layout & Rendering", extra repaints)
     Chrome 21.0.1180.89: FAIL

What steps will reproduce the problem?
1. Enable "Composited render layer borders" in chrome://flags
2. Load attached file. In this file there is an element with a translate3d with a 1sec transition. The translate3d is changed every two seconds.
3. Observation 1 - first red box: Note that during the transition of the element with translate3d the "opacity" element is turned into a composite layer. This composite layer goes away after the transition is over.
4. Observation 2 - second red box: This time the element with opacity is contained within another composite layer (forced with an identity translate3d). In this case the "opacity" element is not made into its own composite layer during the transition.
5. ...

What is the expected result?
5. Observation 3 - third red box: Element with opacity should not be made into its own composite layer for the same reason the element with opacity in Observation 2 is not made into its own composite layer.


What happens instead?
5. Observation 3 - third red box: Element with opacity is made into its own composite layer. The only difference here is that the element with opacity has a sibling with is a composite layer.

The above is an example were we needlessly make elements with opacity their own composite layer for the duration of the transition of a translate3d. Promoting these elements to be their own composite layer and back causes repaints which are wasteful. Fixing this bug would improve performance.

Note this not only affects elements with opacity, but also elements with position: relative/absolute in the same way.

UserAgentString: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_8_1) AppleWebKit/537.1 (KHTML, like Gecko) Chrome/21.0.1180.89 Safari/537.1

-- 
Configure bugmail: https://bugs.webkit.org/userprefs.cgi?tab=email
------- You are receiving this mail because: -------
You are the assignee for the bug.