1366x768 is my screen resolution, and it's a laptop. I noticed that my browser (chromium, last version) doesn't always choose the best image. It looks like that:
<img src="1.webp" srcset="1.webp 200w, 2.webp 400w, 3.webp 604w, 4.webp 800w" loading="lazy" sizes="(max-width: 400px) 100vw, (max-width: 604px) 50vw, 35vw" width="800" height="1606">
When the width is approaching th 400px (say, 395), it chooses the 604px version instead of the 400 one. I verified the dimensions etc with developpers tools.
Also, is there something better to do than precising sizes in viewport units ? Because the percentage of the screen the site takes depends on its size (because body never exceeds 21cm, to imitate a A4 paper sheet). Why can't it use % instead ?