Why can’t we preload mobile size for mobile, and larger size for desktop?

Agreed mobile is paramount.
Plugin needs to detect images to preload by classname “featured-image” ect…

Needs to detect if user has srcset set.

Plugin needs to deliver multiple size outputs, for example…

<link rel="preload" as="image" href="IMAGE URL.jpg?f=auto" imagesizes="(max-width: 700px) 100vw, 700px" imagesrcset="IMAGE URL.jpg?f=auto 700w,IMAGE URL.jpg?f=auto 300w,IMAGE URL.jpg?f=auto 120w,IMAGE URL.jpg?f=auto 650w," />

Agreed!
It should be responsive and deliver only the appropriate size.

Does this mean that the large image is downloaded for mobile even if the HTML has the srcset attribute?

Ok, this is what I’m seeing in the source code.

<link rel=”preload” as=”image”
href=”https://domain.com/wp-content/uploads/2021/12/image-2.jpg&#8221;
imagesrcset=”https://domain.com/wp-content/uploads/2021/12/image-2.jpg 700w,
https://domain.com/wp-content/uploads/2021/12/image-2-300×169.jpg 300w,
https://domain.com/wp-content/uploads/2021/12/image-2-500×281.jpg 500w”
imagesizes=”(max-width: 700px) 100vw, 700px” />

And a page test shows that only one version of the image is downloaded.

So, I guess all is good