1766397 - CSS drop-shadow animation jerky and not smooth

Status: NEW

(Core :: Graphics: WebRender, defect, P3)

Description

[manfred]

Attachment: drop-shadow_pulsating_animation.html

User Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:99.0) Gecko/20100101 Firefox/99.0

Steps to reproduce:

Using FF 99.0.1 64bit on W10 20H2 64bit.
Created sample HTML with pulsating drop shadow for simple box. See attachment.

Actual results:

CSS drop-shadow transition is very jerky, jumpy and not smooth at all.

Expected results:

CSS drop-shadow transition should be as smooth as in Chrome or Edge.

Comment 1

[BugBot [:suhaib / :marco/ :calixte]]

The Bugbug bot thinks this bug should belong to the 'Core::CSS Parsing and Computation' component, and is moving the bug to that component. Please correct in case you think the bot is wrong.

Comment 2

[Gregory Pappas [:gregp]]

15:45.40 INFO: Last good revision: 8e9c1ffdeed84e460a9ba7f9e83ca24319a15c87
15:45.40 INFO: First bad revision: b7f88e5c537bb7d64ba9d4cb58b052650d510638
15:45.40 INFO: Pushlog:
https://hg.mozilla.org/integration/autoland/pushloghtml?fromchange=8e9c1ffdeed84e460a9ba7f9e83ca24319a15c87&tochange=b7f88e5c537bb7d64ba9d4cb58b052650d510638

Comment 3

[Glenn Watson [:gw]]

This appears to be fixed for me in current nightly (which will be from bug #1765013). Are you able to verify? (the patch was also uplifted to beta).

Comment 4

[Gregory Pappas [:gregp]]

Attachment: nightly.webm

Still seeing this in the latest Nightly

Comment 5

[Gregory Pappas [:gregp]]

I am still seeing this in the latest Nightly

Comment 6

[BugBot [:suhaib / :marco/ :calixte]]

Set release status flags based on info from the regressing bug 1749380

Comment 7

[manfred]

Attachment: drop-shadow_FF99_FF101_GC.wmv

Left is FF 99.0.1
Middle is FF 101.0a1 -> "seems" to be little better
Right is GC 100.0.4896.127 -> smooth and nice

Comment 8

[manfred]

Checked now with:

• FF 99.0.1 (of course still not smooth)
• FF 101.0a1 (seems a little better)
• GC 100.0.4896.127 (smooth and nice)

See above attachment "drop-shadow_FF99_FF101_GC.wmv"

Comment 9

[manfred]

"Real life" example hier on my site: https://www.tr1.de/pages/forum.php
Check the "Register" button on the top-right.

Comment 10

[manfred]

Not related to this but I've seen the below issue while debugging the drop-shadow bug:

If keyframes are defined with 0: instead of 0%:, it works in the browser but the 0%: rule is not displayed in the CSS rule view from the FF developer tools. In my case only the 50%: and 100%: rules are shown. That might be a bug.

I'm using since ages the YUI Compressor (https://yui.github.io/yuicompressor/) which optimizes the 0%: to a 0: ...

Comment 11

[Jamie Nicol [:jnicol]]

Thanks for the bug report manfred. Could you please try taking a performance profile. Go to profiler.firefox.com and follow the instructions to install. In the drop down menu this installs in your toolbar please select "Graphics" under the settings. Then press ctrl+shift+1 to start capturing and ctrl+shift+2 to stop. This should open a new tab with the profile, and in the top-right there will be a "Upload local profile" button. Please click that then share the URL here. If you need any help with that please let me know. Thanks!

Comment 12

[manfred]

Hope I did it correct:
https://share.firefox.dev/3y0bECM

Comment 13

[Jamie Nicol [:jnicol]]

That's great, thanks.

The profile looks fine. I was mistaken, this isn't actually a performance issue but something about the rendering of the animation that makes it look jumpy

Comment 14

[BugBot [:suhaib / :marco/ :calixte]]

Set release status flags based on info from the regressing bug 1749380

Comment 15

[manfred]

With FF 100.0 I can't see the bug anymore at the button from my website. See above comment 9: "Real life" example...
But with the attached .html file, there is still a small jumping of the shadow. Much better than before but not gone.

Comment 16

[Mayank Bansal]

This was not fixed by bug 1768678. I can still repro in the latest nightly