I’m facing this problem in my lighthouse audition:
“Animations which are not composited can be janky and increase CLS”
Element
div.td-mobile-container
Unsupported CSS Property: visibility
div#td-login-mob.td-login-animation.td-login-hide-mob
Unsupported CSS Property: visibility
div#td-forgot-pass-mob.td-login-animation.td-login-hide-mob
Unsupported CSS Property: visibility
label
What can I do about that?
Hi josp, the above css seems to be related to the mobile version.
Please provide me a link to your website to can make some testes and inspect the results from lighthouse audition, in this way I hope to can provide some working solutions.
Thank you for your understating!
Hi, Calin.
The site is https://osaopaulo.org.br
Hi,
“Unsupported CSS Property” is trying to tell you that one of the properties you’re animating prevents the animation from being composited. Was this your interpretation? Whether the animation is scheduled via JS or CSS shouldn’t really make a difference here.
It is this case.
I think there’s a misunderstanding about this audit. The exact purpose of this audit is trying to surface to you animations that cannot be composited by the browser.
Thank you for your understating!
I am having trouble to understand what you answered me, Calin.
You asked me about my interpretation.. Interpretation of what, exactly?
I asked about some errors that have been shown to me at my lighthouse audition, on composited animations. The audition shows that some elements (login, some buttons, and the newsletter form, among others) are non-composited, probably because of the unsupported CSS property..
I think that what you tried to tell me is that there is nothing for me to do, and I should wait for some miracle to occur, to fix that problem (that impacts in CLS). I got this correctly?
Hi,
What I mean about composited animations is that the elements that are reported on lighthouse are displaying on mobile and are working then you do not have to do anything, the problem appear when the elements do not appear or are not working.
Also we hope that the next theme update to have lest elements that will impact the CLS.
Thank you for your understating!
Ok, got it.
The thing is that, although it works, it adds a negative score in lighthouse audition, thus it’s not a thing that I can just ignore (neither do you)… Hoping, again, that the next update solves it!
Another thing, in the same area: this result shows that a mobile element is loaded in my desktop version. Is there nothing to do to deactivate this, in particular?
div.td-mobile-container
div#td-login-mob.td-login-animation.td-login-hide-mob
div#td-forgot-pass-mob.td-login-animation.td-login-hide-mob
Hello !
I have passed this topic to our developers and they will take a look at improving the theme in the next updates.
Thank you !
Hello, as Calin had alerady told me, ans as I answered him, I’ll wait (and pray for a miracle) that this problem will be solved.
But, I think that one question was not answered: Another thing, in the same area: this result shows that a mobile element is loaded in my desktop version. Is there nothing to do to deactivate this, in particular?
As I keep both versions (mobile and desktop) separated, is there a way to stop the theme from loading mobile elements in desktop version?
Hello !
This may happen due to an element that is used on both viewports. I have checked and this seems to be on our developers to do list.
Thank you !
OK! Let’s wait..
Hi again!
About the original issue, of the composited animations, it seems that the problem with the “div.td-mobile-container” element is gone, but new ones have appeared, this time in the TD Newsletter: https://paste.pics/C2TPA
Is there any news if a fix will be available for these issues?
Thanks!
Hello !
I have passed this to our developers, they will definitely take a look into it.
I will keep you updated with any progress.
Thank you !
Ok! Let’s wait a little bit more.
Hi, Vlad!
Any news about this issue?
Hello!
Unfortunately there is no update regarding this issue. Our developers TO DO list is pretty big, we are sorry for the inconvenience!
Thank you!
Hi!
Funny thing: they fixed the issue, without even noticing!
For now, at least, the issue is gone in the PSI report
