Lazy loading of images

  • Resolved maria_wp

    (@maria_wp)


    3 years, 8 months ago

    When I enable the option lazy loading for images obviously a class is added and some additional code is executed as soon as scrolling starts.

    Wouldn’t there be the possibility to simply add loading="lazy" since this should be supported by many browser already?

    Since I didn’t see any entry here I’m interested in if this might be an alternative option to the existing one.

Viewing 7 replies - 1 through 7 (of 7 total)
  • Plugin Author Optimizing Matters

    (@optimizingmatters)

    That exact functionality is in WordPress core by default maria_wp, so if you disable lazyload in AO you should see this happening ??

    Thread Starter maria_wp

    (@maria_wp)

    Well I don’t see it really. When disabling it than all of the pics are loaded at the beginning. I can set the option manually on the pics but somehow than all pics load at the beginning. By default this options isn’t injected – at least from my point of view.

    Plugin Author Optimizing Matters

    (@optimizingmatters)

    Check the HTML source, loading=lazy _should_ be there if AO’s lazyload is off?

    Thread Starter maria_wp

    (@maria_wp)

    Sorry for being late :-/

    I cannot confirm your assumption. Tags with don’t have automatically inserted loading="lazy". I didn’t find a real hint what are the preconditions to be met that this will be inserted.

    Anyway I’ve added them manually and don’t see much more to do.

    Plugin Author Optimizing Matters

    (@optimizingmatters)

    well, it’s WordPress core that decides if the loading attribute is added, see https://github.com/WordPress/WordPress/blob/52679edbffe1a28cf7fce54ab2077f299c8cf27e/wp-includes/media.php#L1888-L1897

    basically; not if loading=”eager” is there, not if there is no image source and not if there are no width and height attributes.

    hope this clarifies?
    frank

    Thread Starter maria_wp

    (@maria_wp)

    Yeah… now I see where is the difference. The tag has no width and height set. This is set on the surrounding <div> attribute. Therefore its not recognized by WP and not added.

    Your plugin adds the attribute anytime – without evaluation if the size attributes are set or not.

    Now its discussable what behaviour is more appropriate.

    Anyway thx for pointing out.

    Plugin Author Optimizing Matters

    (@optimizingmatters)

    yeah, AO (and Lazysizes as JS lazyload component used by AO) will try to make do even without width/ height. As always test to see what works best in your specific context ??

Viewing 7 replies - 1 through 7 (of 7 total)
  • The topic ‘Lazy loading of images’ is closed to new replies.