First Look At The CSS object-view-box Property

But yes, since you already know the possible proportions and sizes you want to resize/crop/scale etc. on the server, and deliver the correct image via a picture element. The browser then fetches exactly what it needs.

This css property is however useful if you want something more dynamic and you don’t know or don’t care to know beforehand how the image will be cropped.

But generally speaking I think that this kind of feature is very useful. It conveys intent, so browsers can optimise things if they choose, and developers get to have cleaner code for free.

Secondly there’s plenty of devs and future devs out there who appreciate that there’s a clear way to do this. Workarounds always have caveats and don’t necessarily play nicely with other features.

.. however the proposed property seems to solve a common use case so I guess it's good its there now.

Right click "Open image in a new tab".

Boom, you see the full image. On the home page, you only saw a cutout of the image.

Now imagine going to AirBnB and changing their workflow so that the server sends the right cutout. It would be a nightmare.

As it is, a frontend guy can change the cutout, do a/b tests with different cutouts, change the cutout dynamically based on window size, change the cutout when the image is displayed on different pages etc etc.

Try to set all of that up by talking to the frontend guys and the backend guys and try to get to a situation so that the frontend talks to the backend in a fashion that the frontend guys can easily do what they do now and the backend responds with the right images. Good luck :)