Lazy loading of gallery thumbnails

Loading all tumbnails can take a significant amount of time/bandwidth (c.f. Matplotlib galleries).

It would be great if the loading could be deferred to the point when the user actually scrolls to the thumbnail.

Unfortunately, from a quick look this seems to not be easy. Lazy loading requires to change the <img> tag to either have an attribute loading='lazy' or use data-src instead of src(https://www.sitepoint.com/five-techniques-lazy-load-images-website-performance/) The thumbnail is generated via a .. figure:: directive (see THUMBNAIL_TEMPLATE), which does not expose any of those.

Ideas are welcome how this could be solved.

[timhoffm]

My original idea was that this setting was applied to the gallery thumbnails only.

This would require an image option

.. image::
   :loading: lazy

AFAICS, docutils has not implemented that. docutils 0.18 only added a global config parameter https://docutils.sourceforge.io/docs/user/config.html#image-loading but not a per-image setting.

Does this handle this issue?

I think that depends. The core issue here is that we want incremental loading of gallery images. Is it ok to tell users to globally switch to lazy loading for all content? If yes, then we can close. If no, we’d need to go back to docutils and request the per-image option, and when that’s done add a sphinx-gallery option to set that option for all thumbnails.

[tacaswell]

It seems the upstream feature request was implemented!

Implemented in Docutils 0.18. Thanks again for the suggestion.