Note from 16 May 2023

Limiting the image density on mobile devices drasticaly improves performance, with no visual loss, so we did it!

Graph of performance monitoring showing a great improvement of LCP

I still wish it was much easier than dealing with <picture> and x descriptors for fluid images… 😞

With a <img maxdensity="2.5" …> attribute for example!

If you agree, comment:

  1. Do you know good tutorials and/or examples about dealing with responsive images that are fluid horizontaly, but with a fixed height?

    Using object-fit: cover; in the CSS is easy, but how can we prevent loading many pixels that will be hidden, without using too many <source> in a <picture>?