Closed Bug 1422567 Opened 2 years ago Closed 10 months ago
Crazy subreddit CSS with hundreds of text shadows is slow in Web
Minimized testcase here: https://codepen.io/anon/pen/YEBLVy Runs at ~15fps on my machine.
Apparently this is a hack to work around text-shadow not having a way to grow the outline other than blur (or alternately, no way to control the shape of the blur falloff). Here's another example of it in action, for a different use: https://eager.io/blog/smarter-link-underlines/
2 years ago
Priority: -- → P3
What's the Firefox performance without WebRender enabled?
It's OK without WebRender - not because rendering is fast (it's even slower than with WebRender) but because scrolling and the animated css background don't cause repaints in that area of the page. (the linked page only reaches 30fps without WebRender because the animated header actually causes continuous repaints, just not to the region with the css shadows)
2 years ago
Priority: P3 → P2
Found another example in the wild, with an even greater hit (runs at ~5fps when the text is in view) https://twofold.salty-salty-studios.com/
This seems to run ok for me on Windows Nvidia. Is it still a problem for you? What hardware?
Actually running it at a higher resolution really slows things down.
See Also: → https://github.com/servo/webrender/issues/3016
Can confirm (Nvidia GTX 970 on Windows 10 x64), latest nightly, on a 4k monitor. Performance on text-shadow heavy pages is abominable. The bottom of the following page is particularily bad: https://system-admin-girl.com/ (beware, anime) Moving the firefox window to a 1080p monitor improves performance significantly, though there are still noticable jitters when beginning a scroll.
Status: NEW → RESOLVED
Closed: 10 months ago
Resolution: --- → FIXED
You need to log in before you can comment on or make changes to this bug.