The issue is “automatically”. For images placed on a page, using the image element, webflow auto-populates the sizes and srcset attributes. Browses will load the initial image in src, then if a bigger image is available, load that. So this part is happening on the page load.
Now, let’s assume you wanted to add lazy loading behavior to images. Webflow is not creating a data-src, data-sizes, and data-srcset attributes for you. If it did, you could just add the script, initialize it and go. There is a wishlist you could vote on. > https://wishlist.webflow.com/ideas/WEBFLOW-I-318
Another way would be to load a target image up to a page so you can see the source, copy the HTML, go back and paste it into an embed, and change the attributes name(s) and set the placeholder src.
This would be very painful to do with lots of images. If the page was in a cms template, you could opt to use data stored in fields for the correct values, but you would still need to fetch them.
Right now I think the best option would be to use a third-party service to handle the generation and serving of the images for you. Cloudinary, for example, has a feature to that allows you to upload one high resolution image to Cloudinary, and have it automatically adapted to the resolution and size appropriate to each user’s device or browser on-the-fly.
With a third-party solution, you still need to add custom js code, and HTML embeds, after loading the images to the third-party.
Webflow should just give us a switch to enable the data-attributes we need, and switch the name of src to data-src, sizes to data-sizes, srcset to data-srcset. Of course, if the lazy loading script was not loading, you would have a problem. They could just add the code to the webflow.js core.
That is the current state of affairs based on my inspection.