GPUI overdraws too much

[kvark]

Check for existing issues

• Completed

Describe the bug / provide steps to reproduce it

It looks like most "ordinary" pixels are being overdraw 5-6 times on screen. See screenshot from RenderDoc's "pass overdrawn" mode. I looked at the green area (5 draws per pixel) and at the yellow one on the left (6 draws per pixel). This is burning GPU power too much unnecessarily and draining the battery.

Ideally, these areas would have 0 to 1 draw. 0 is possible because the render pass is starting with a clear color. For elements overlapping each other, there needs to be some technique for pixel rejection employed. Generally it's depth or stencil testing. For example, WebRender draws opaque elements from front to back and writes to depth, preventing deeper layers from overwriting the pixels of the front layers.

Environment

Linux (but it unlikely matters)

[jansol]

I'm not sure GPUI has anything fully opaque? Since practically all elements are antialiased rounded rectangles which require alpha blending.

[kvark]

@jansol not all elements have rounded corners. For example, #7231 makes the fast path for such quads that are just quads, and it makes a good difference.
In WebRender we'd also split a rounded-cornered element into a "9 patch", which consists of 5 fully opaque rectangles and 4 semi-transparent rectangles. This allows drawing most of the element early as opaque.

[jansol]

Right, makes sense. And I assume it just skips elements with a non-opaque background color.

[github-actions]

Hi there! 👋
We're working to clean up our issue tracker by closing older issues that might not be relevant anymore. Are you able to reproduce this issue in the latest version of Zed? If so, please let us know by commenting on this issue and we will keep it open; otherwise, we'll close it in a week. Feel free to open a new issue if you're seeing this message after the issue has been closed.
Thanks for your help!

[jansol]

AFAIK there has been no change to this.

[someone13574]

In WebRender we'd also split a rounded-cornered element into a "9 patch", which consists of 5 fully opaque rectangles and 4 semi-transparent rectangles.

Wouldn't you only need three fully opaque?

[kvark]

Yes, you can make just 3 opaque.