Severe scroll jank with sticky header + backdrop-filter + lazy images
On my website, fast scrolling causes major stutter when a sticky header with backdrop-filter overlaps a long list of lazy-loaded images. Steps: Open website → scroll quickly several screens Expected: Smooth 60fps; Actual: drops to ~5–10fps + “page slowing down” warning Notes: Removing backdrop-filter fixes; setting images to eager helps Env: Windows 11, Firefox 130 (64‑bit); Chrome/Edge are smooth Any known bug IDs or CSS workarounds (e.g., force own layer, reduce blur radius)?
Upravil(a) Samrin Komal dňa
Vybrané riešenie
There seem to be a lot of open bugs with backdrop-filter --
https://bugzilla.mozilla.org/buglist.cgi?quicksearch=backdrop-filter&list_id=17673897
I don't know whether any one of those looks particularly relevant and might list a workaround.
Many bugs have been marked fixed. You could test in Nightly to see whether they have addressed your issue.
https://www.firefox.com/en-US/channel/desktop/#nightly
Čítať túto odpoveď v kontexte 👍 0Všetky odpovede (3)
Vybrané riešenie
There seem to be a lot of open bugs with backdrop-filter --
https://bugzilla.mozilla.org/buglist.cgi?quicksearch=backdrop-filter&list_id=17673897
I don't know whether any one of those looks particularly relevant and might list a workaround.
Many bugs have been marked fixed. You could test in Nightly to see whether they have addressed your issue.
Also, don't test with Firefox 130, since that is EOL. I suggest testing with the Extended Support Release of Firefox 140:
Ak chcete odpovedať na príspevky, musíte sa prihlásiť do svojho účtu. Ak ešte nemáte účet, položte novú otázku.