When using an adaptive image with an <img> without breakpoints (i.e., without the sizes attribute), you usually provide several versions of the same image in different resolutions, which you then define in the srcset attribute using the pixel density syntax, for example 1x , 2x , 3x
However, usually the 1x version of an image is the same image that is already defined in the src attribute, so it is a bit redundant. So, I am wondering - does the 1x version of the <img> parameter in the srcset parameter really be srcset / required?
When using only
<img src="http://placehold.it/350x150" srcset="http://placehold.it/700x300 2x">
instead
<img src="http://placehold.it/350x150" srcset="http://placehold.it/350x150 1x, http://placehold.it/700x300 2x">
then at least FireFox will correctly display the 350x150 image, and as soon as the zoom level / dppx is > 1 , it will use the 700x300 image.
srcset 1x definition in srcset save several bytes, especially on a page with a large thumbnail gallery, for example.
source share