Bug 240752

Summary: REGRESSION: Hardware accelerated animations using steps() no longer works
Product: WebKit Reporter: CJ Gammon <gammon>
Component: AnimationsAssignee: Nobody <webkit-unassigned>
Status: RESOLVED WORKSFORME    
Severity: Normal CC: dino, graouts, graouts
Priority: P2    
Version: Safari 15   
Hardware: All   
OS: All   
Attachments:
Description Flags
Transform Animation with step() which chokes when main thread busy none

Description CJ Gammon 2022-05-20 20:06:24 PDT
Created attachment 459634 [details]
Transform Animation with step() which chokes when main thread busy

Using steps() in a css animation with transforms suffers performance issues when the main thread is occupied. This doesn't seem to occur in any other major browser.

In the attached example clicking the button will occupy the main thread for 2 seconds. The animation pauses in webkit. It should instead continue animating as though the button was not clicked.

Found previous example of this issue marked fixed:
#186129
Comment 1 Antoine Quint 2022-05-23 00:20:21 PDT
Hi CJ. I don't think we ever were able to run steps() animation accelerated. You say this is a regression, but do you have a previous version of Safari where you know this to be working the way you expect it to and which no longer does with a current Safari?
Comment 2 Antoine Quint 2022-05-23 00:21:42 PDT
Bug 186129 was about animation of properties that *could* be accelerated which didn't visibly animate using the steps() timing function.
Comment 3 CJ Gammon 2022-05-23 06:08:22 PDT
Hi Antoine, you are right, sorry. Saw the previous ticket and noticed it worked well in chrome so thought this was the case here. If the intention is for this to not work then it isn't a bug.
Comment 4 Antoine Quint 2022-05-23 06:37:07 PDT
I wouldn't say the current behavior is our intention per se, I certainly wished it worked better, but it's definitely the expected behavior for now.