Bug 280316 – Excessive repainting when scrolling position:sticky in some configurations

• Status: RESOLVED
• Resolution: FIXED
• Component: Layout and Rendering

[Simon Fraser (smfr)]

Scrolling on website for Poor Charlie’s Almanack is incredibly laggy in Safari, works well in Chrome.

Steps To Reproduce:
1. Visit https://www.stripe.press/poor-charlies-almanack/talk-one?progress=0.00%
2. Scroll with trackpad

Results:
Website lags while scrolling, works great in Chrome

[Simon Fraser (smfr)]

<rdar://120280327>

[Simon Fraser (smfr)]

Pull request: https://github.com/WebKit/WebKit/pull/34207

[David]

I have the exact same issue with this website : https://staging.geloso.com (which will soon become simply https://geloso.com, so if you see this in the future, it might be flipped to live). 

The sticky panels make Safari want to explode, whereas there's no difference in performance wether they're sticky or not in Chrome or Firefox, so I'll have to deactivate them until the solution is released.

[Simon Fraser (smfr)]

I tested, and https://staging.geloso.com/ seems OK even without the fix; I don't see excessive repainting.

[EWS]

Committed 284802@main (6a6822efc75a): <https://commits.webkit.org/284802@main>

Reviewed commits have been landed. Closing PR #34207 and removing active labels.

[David]

Mm might be another issue, but there's definitely a huge difference. For example, testing in Safari Tech Preview: https://youtu.be/qB1TwNaCjLM

The framerate visibly drops, not only that but the rendering seems to stutter and hit a low-enough point that the GPU needs to "catch up" and repaint multiple frames at once.

Removing the position sticky helps a lot. The framerate now doesn't seem to drop below 25 (which is better than the lowest around 10) but the stuttering is now also gone, probably because the GPU isn't overloaded and does't need to catch up.

Granted it's a pretty complicated website with lots of animations and smooth scrolling, but it runs perfectly in both Chrome and Firefox, wether position sticky is there or not.

[EWS]

Committed 283286.471@safari-7620-branch (374b5e1de0e5): <https://commits.webkit.org/283286.471@safari-7620-branch>

Reviewed commits have been landed. Closing PR #2234 and removing active labels.