Header animation is very slow
Categories
(Core :: Layout, defect)
Tracking
()
Tracking | Status | |
---|---|---|
firefox79 | --- | affected |
People
(Reporter: karlcow, Unassigned)
References
()
Details
I don't know if this is DOM:Animation or Layout.
As reported on https://webcompat.com/issues/54452
Go to https://myki.com/careers/
Heading animation is really laggy / slow
(Web render is enabled)
even when webrender is off, this is laggy.
TranslateX and TranslateY are very laggy. TranslateZ seems to fare a bit better.
https://bugzilla.mozilla.org/buglist.cgi?quicksearch=rotate%20animation&list_id=15313333
the animation is created by a series of 147 animated li…
section#careers #banner .scene .wrapper .tunnel {
position: relative;
width: 15.384rem;
height: 15.384rem;
margin: 0 auto;
transform-style: preserve-3d;
animation: roundandround 500s infinite linear;
}
@keyframes roundandround {
to {
transform:rotateX(360deg)
}
Comment 1•4 years ago
|
||
Moving to Layout for now.
Though I haven't looked into defail, this will be mitigated by 1638152. That said, on Chrome it's much worse than Firefox.
Reporter | ||
Comment 2•4 years ago
|
||
so on macos 10.15.5 (19F101) Intel Iris Plus Graphics 1536 Mo, 2 GHz Intel Core i5 4 Core
- smooth. Chrome Canary Version 86.0.4185.0 (Build officiel) canary (64 bits)
- smooth. Safari Tech Preview Release 109 (Safari 14.0, WebKit 15610.1.17.2)
- laggy. Firefox Nightly 79.0a1 (2020-06-28) (64-bit) (webrender off in about config, but is on in about:support)
Comment 3•4 years ago
|
||
Oops, I mis-read as it's WebRender on.
Comment 4•4 years ago
|
||
Well, it should be bug 1100357.
Comment 5•4 years ago
|
||
I don't think that's it. I think we're incorrectly throttling the animation. If you give it a finite iteration count, then we don't throttle it, and the animation looks smooth.
Comment 6•4 years ago
|
||
On my environment I can see "the frame size is too large relative to the viewport blah blah" warning on the animation inspector.
You mean about "spin" animation? Then there are two different issues. (And I guess there is one more problem related preserve-3d).
Reporter | ||
Comment 7•4 years ago
|
||
Let me fix something I said earlier I said I tested with webrender off as it was displayed in about:config.
BUT about:support tells a different story. Compositing WebRender
So the issue on macOS happens with WebRender.
I realized this because of this message
The Graphics team recently enabled WebRender on MacOS (with newer Intel GPUs) in Nightly by default.
Updated•4 years ago
|
Comment 8•2 years ago
|
||
The site is no longer live.
Updated•2 years ago
|
Description
•