2

In Google PageSpeed Insights, getting a lot of alerts as Unsupported CSS Property.

Avoid non-composited animations Animations which are not composited can be janky and increase CLS.

Unsupported CSS Property: font-weight Unsupported CSS Property: color Unsupported CSS Property: margin-right Unsupported CSS Property: font-size Unsupported CSS Property: background-position-y Unsupported CSS Property: background-position-x Unsupported CSS Property: margin-bottom . . . So on..

Attaching the image also: Screenshot of the Alerts

Anonymous Girl
  • 582
  • 8
  • 22
  • You need to write you post as a question. I can see the alerts that you get, but it is difficult to give advice when you are not providing code examples. Please read: https://stackoverflow.com/help/how-to-ask – chrwahl May 09 '21 at 12:29
  • Hi Laptic, did you ever find a solution to this problem? – Dr Spaceman May 29 '21 at 07:31

1 Answers1

1

For anyone stumbling on this (like me) after spending some time to find a solution:

Here is where you should start looking:

Non-Composited Animations:

A non-composited animation is any animation that triggers one of the earlier steps in the rendering pipeline (Style, Layout, or Paint). Non-composited animations perform worse because they force the browser to do more work.

The linked article is from web.dev an should be reachable for the next few years. The article has a few useful links that might help you search to a solution:

All links point towards web.dev.

odil-io
  • 180
  • 9