Bad flicker on LastEnergy.com
Categories
(Core :: Graphics: ImageLib, defect, P2)
Tracking
()
People
(Reporter: ekr, Assigned: tnikkel)
References
(Blocks 2 open bugs, Regression, )
Details
(Keywords: regression)
Attachments
(2 files)
STR:
- Go to https://www.lastenergy.com/technology
- Scroll downward
Expected Behavior: No flicker
Actual behavior: Very bad flicker
Reporter | ||
Comment 1•2 years ago
|
||
This works fine with Chrome.
Comment 2•2 years ago
|
||
Works fine when I enable image.decode-sync.enabled
in about:config. Interestingly, setting the decoding hint doesn't make the flicker go away. I wonder if that has something do with this being a Lottie/svg animation?
document.querySelectorAll("img,image").forEach(img=>img.decoding="sync");
Comment 3•2 years ago
|
||
Regression window:
https://hg.mozilla.org/integration/mozilla-inbound/pushloghtml?fromchange=f608a5a5d8e2472396a0f4cd04778730866b8ae0&tochange=c61b11debf423499104a9c547590850f63a56fa4
Setting image.decode-sync.enabled to true seems to fix the issue on Nightly111.0a1 Windows10.
Updated•2 years ago
|
Comment 4•2 years ago
|
||
:tnikkel, since you are the author of the regressor, bug 1341881, could you take a look? Also, could you set the severity field?
For more information, please visit auto_nag documentation.
Assignee | ||
Comment 5•2 years ago
|
||
(In reply to Gregory Pappas [:gregp] from comment #2)
Works fine when I enable
image.decode-sync.enabled
in about:config. Interestingly, setting the decoding hint doesn't make the flicker go away. I wonder if that has something do with this being a Lottie/svg animation?document.querySelectorAll("img,image").forEach(img=>img.decoding="sync");
Ah, so the reason the decoding=sync isn't working is because the image elements that are there on page load are actually inside the <defs> section of the contained svg. The image element that actually displays the image to the screen looks to be created dynamically as we scroll down. So these elements would need the decoding sync attr set on them at creation time.
Assignee | ||
Comment 6•2 years ago
|
||
Thanks for everybody's investigation and tagging of bugs here. I plan to work on this as part of bug 1801052 soon.
Comment 7•2 years ago
|
||
Reduced test case: https://gregorypappas.github.io/misc/bugs/1816504/reduced.html
I wanted to upload it directly to BMO. Sadly, this Lottie animation is a 22 megabyte file, which is above the limit.
Edit: I hacked together a smaller version that will fit inside BMO.
Comment 8•2 years ago
|
||
Comment 9•2 years ago
|
||
Updated•2 years ago
|
Updated•2 years ago
|
Comment 10•2 years ago
|
||
Set release status flags based on info from the regressing bug 1341881
Updated•2 years ago
|
Updated•2 years ago
|
Assignee | ||
Updated•2 years ago
|
Updated•2 years ago
|
Updated•2 years ago
|
Updated•1 year ago
|
Description
•