Bug 256380 - Optimize clip-path rendering on stack overflow.com
Summary: Optimize clip-path rendering on stack overflow.com
Status: NEW
Alias: None
Product: WebKit
Classification: Unclassified
Component: Compositing (show other bugs)
Version: WebKit Local Build
Hardware: Unspecified Unspecified
: P2 Normal
Assignee: Nobody
URL:
Keywords: InRadar
Depends on:
Blocks:
 
Reported: 2023-05-05 11:10 PDT by Simon Fraser (smfr)
Modified: 2023-05-05 11:14 PDT (History)
3 users (show)

See Also:


Attachments

Note You need to log in before you can comment on or make changes to this bug.
Description Simon Fraser (smfr) 2023-05-05 11:10:01 PDT
stackoverflow.com has an element with a clip-path that is expensive to rendering, especially with GPU process:

<div style="clip-path:url(#curve)" class="p32 sm:p12 bar-lg p-bg-dark-gradient d:fc-black-750 ps-relative z-selected fc-black-025 p-font-smooth mbn128 pb128">

<svg width="0" height="0" class="ps-absolute">
        <defs>
            <clipPath id="curve" clipPathUnits="objectBoundingBox">
                <path d="M0,0 H1 V0.988 a0.007,0.012,0,0,1,-0.009,0.011 C0.955,0.983,0.802,0.925,0.501,0.925 C0.2,0.925,0.045,0.984,0.009,1 A0.007,0.012,0,0,1,0,0.988"></path>
            </clipPath>
        </defs></svg>
Comment 1 Radar WebKit Bug Importer 2023-05-05 11:10:30 PDT
<rdar://problem/108957530>
Comment 2 Simon Fraser (smfr) 2023-05-05 11:11:47 PDT
We don't use the composited clip path approach here, and instead fall back on the layer + mask approach, because the clip-path references an SVG element, and we don't yet have code to compute composited clip paths via referenced elements.
Comment 3 Simon Fraser (smfr) 2023-05-05 11:14:08 PDT
We also repaint both the mask and the primary layer when any repaint happens, because we're not smart enough to work out if a change only affects the layer, not the mask.