Major Content Layer Shift Due to Lazy Loading Images

  • Resolved cbw5007

    (@cbw5007)


    3 years, 8 months ago

    Hi,

    Many people are seeing content layer shifts issue due to something that changed with a3 lazyload or the popular theme generate press.

    The CLS issue is not picked up in google page speed lab data but is shown in the field data. This makes websites not pass the google core web vitals which is going to be very important soon.

    If you could work to fix this problem ASAP that would be great as I like a3 lazyload better than other lazy loader plugins.

    From another a3 support user.

    I am seeing similar issues. A3 lazy load adds its placeholder gif into src which has an aspect ratio of 1:1. The browser thinks the actual img has an aspect ratio of 1:1 and scales the entire frame.

    What is happening is a3 saves the space for the width rather than the height of the image. Maybe A3 assumes that the height is going to be defined first. However, generate press defines the width and then the height.

    Please let me know if you can fix this quickly. It takes a long time for the field data to update so the sooner the better!

    Thank you!

Viewing 3 replies - 1 through 3 (of 3 total)
  • Thread Starter cbw5007

    (@cbw5007)

    Also to test this go to a page, inspect, go to network online, and select slow 3g. This lets the page load slow so you can see the content layer shifts.

    Thread Starter cbw5007

    (@cbw5007)

    I think the issue is because lazy load is now built into wordpress. Use a3 lazyload for videos now but not images. Maybe this is why it seems like fewer people are using a3 lazy load. It was a great plugin before that. Thank you!

    Thread Starter cbw5007

    (@cbw5007)

    After further testing the new WordPress automatic lazyloading is slow. It also creates other problems saying images do not use http/2. In addition, even if I just lazyload videos there are issues with cls with A3 or the video thumbnails not lazyloaded with wprocket.

    It would be really nice if A3 lazyload could be fixed to work without the CLS issue. If so it would still be the best lazy loader for WordPress.

    Any chance someone is working to fix the CLS issue?

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Major Content Layer Shift Due to Lazy Loading Images’ is closed to new replies.

Tags