Changes between Version 4 and Version 5 of Accelerated rendering and compositing


Ignore:
Timestamp:
Apr 19, 2012 12:11:42 PM (12 years ago)
Author:
jonlee@apple.com
Comment:

--

Legend:

Unmodified
Added
Removed
Modified
  • Accelerated rendering and compositing

    v4 v5  
    2424Painting: walk through RenderLayer tree, starting with the root, then go through child RenderLayer. Use RenderLayer for clipping and overflow.
    2525
    26 Hit testing: reverse walk through child RenderLayers.
     26Hit testing: reverse walk through child RenderLayers. It is done in software in RenderLayer code, and so should be same for all platforms.
    2727
    2828There is another hierarchy of RenderLayers which is important, and that is the z-order tree. This tree provides back-to-front ordering, and is used to support the z-index CSS property. Before painting, compute z-order tree by going through RenderLayer tree. Find stacking contexts.  Painting and hit testing use this z-order tree, not the RenderLayer tree.
     
    4040GraphicsLayers are in their own tree. Used by platform code (like CoreAnimation) to create PlatformLayers. GraphicsLayers can have more than one platform layer; see masks and reflections. GraphicsLayers have a way of dumping its tree, can get it from gdb.
    4141
     42Overlap testing: RenderLayerCompositor contains a list of rects of things that have been composited. Makes other layers composited if they intersect that list of rects.
    4243
    43 test for overlap. RLCompositor list of rects of things that have been composited. Makes other layers composited if they intersect that list of rects.
     44Clipping: imagine a div with overflow:hidden, child with transform or video. Implement clipping via platform layer. On Mac: CALayer add masks to apply. If a layer is composited through clipping, it doesn't have its own backing store, paints into something behind it.
    4445
    45 clipping: div with overflow:hidden, child with transform or video. impl clipping via platform layer. on mac: calayer add masks to apply. if a layer is composited through clipping, it doesn't have its own backing store, paints into something behind it.
     46Reflections: clone layers, track clones. It's tricky.
    4647
    47 reflections: cloning layers, tracking clones. tricky.
     48Some RenderLayers are special because it contains content that benefits from compositing. Example: RenderVideo gets RenderLayer, becomes composited. The Mac media player hands PlatformLayer to compositing code.
    4849
    49 special layers, because of content that benefits from composites. video, rendervideo gets renderlayer, becomes composited. communication between mac media player and comp code so that media player hand pl to comp code, and pl into compositing layer tree.
     50Layer intersections: with 3d transforms, we paint into a GL texture. If a child element intersects with its parent element, the spec now states that the child element's layer needs to break into subtextures along intersection.
    5051
    51 layer intersections: allows 3d transforms, to paint into a gl texture. If layers intersect (child through parent), break into subtextures along intersections.
     52Overlap map is updated when there is a layout or style change that changes the compositing layer tree.
    5253
    53 hit test is done in software in RL code. hit testing should be same for all paltforms.
     54Special casing CSS animations: when a transform or opacity animation is running, we don't updating clipping during animations. Update layout at start and end, not during. Don't update scrollbars during, for example. It's a cheat, but gives performance.
    5455
     56Overlap test is used if real (not identity) 3d transforms are not present in page.
    5557
     58Platforms have their own accelerated drawing implementations. On Mac, but compositing still has value when there is accelerated drawing, but it depends on content. There is feedback from platform code to tell RenderLayerCompositor when it's valuable to do compositing.
    5659
     60Plugins like Flash force compositing mode.
    5761
    58 overlap map is updated when there is a layotu or style change that changes compositing layer tree.
     62Text: on Mac there is a limitation on graphics system where rendering text on transparent background, doesn't do subpixel antialiasing. So the text looks "skinnier". There is no good solution to this problem right now. If something is composited, but with opaque bg-color, then it's fine.
    5963
    60 special casing css animations. which transform animation is running, we don't updating clipping during animations. update at start and end, not during. don't change layout during. don't update scrollbars, for example. it's a cheat, but gives performance. opacity animation also.
     64Limitations on compositing: not smart when applying scale trasnforms. On Mac, scale:2 just blows up bitmap, and looks fuzzy. MSIE10 uses Direct2D so it doesn't have this issue.
    6165
    62 overlap test is used if real 3d xforms are not present in page.
    63 
    64 
    65 platforms have their own accel drawing impls. on mac, but compositing still has value when there is accel drawing, but depends on content. feedback from paltform code to tell RLCompositor when its valuable to do compositing or not.
    66 
    67 
    68 - plugins like flash force compositing.
    69 
    70 text: on mac there is a limitation on gfx sys where rendering text on transparent background, can't do subpixel antialiasing. no good soln to this problem right now.  if something is composited, but with opaque bg-color, then it's fine.
    71 
    72 
    73 limitations on compositing: not smart when applying scale trasnforms. on mac, (scale:2) just blow up bitmap, looks fuzzy.
    74 
    75 ms support: ie10 has transforms and animations. doing stuff with direct2d when dealing with scaling.
    76 
    77 
    78 if we redid wk, would it based on compositing primitives instead of bitmap primitives? this lives under the platform layer. only ms has done this by throwing everything out and rebuilding with direct2d.
    79 
    80 webcore lacks logic where knowing if elements up front obscure stuff behind it. right now it just repaints everything behind it from back-to-front.
    81 
    82 svg compositing? doesn't use rl at all. split up rl, piece related to compositing needs to be something svg could use.
    83 
     66If we redid WebKit, would it be based on compositing primitives instead of bitmap primitives? No, it probably has to live under the platform layer. MSIE10 has thrown everything out and rebuilt using Direct2D, with good performance gains.
    8467
    8568== Debugging ==
     
    9679 1. Gmail bug anecdote: copy the DOM into a fresh document, to give you a snapshot. Although there was no CSS styling, the bug still repro'd.
    9780 1. Via inspector, start deleting nodes.
     81
     82== The future ==
     83
     84WebCore lacks logic where knowing if elements up front obscure stuff behind it. Right now it just repaints everything behind it from back-to-front.
     85
     86SVG compositing? Currently doesn't use RenderLayer at all. Probably need to split up RenderLayer with a separate compositing piece which SVG could use.