响应式图像:调整大小或动态裁剪？

这个问题实际上与编码无关,而是为任务选择正确的方法.我不知道它是否违反了SO的规则但是你去了..

我曾为当地报纸建立了一个小型CMS,为他们提供了添加帖子和照片的功能.关于照片,他们过去上传了一张照片,我根据他们可能选择的不同模板保存了该照片的各种版本(模板而不是屏幕尺寸!)

现在,我被要求更新这个旧系统,我面临着响应/适应性的困境.

就我在网上的调查结果而言,下一个重要的是元素.我找到了很多资源,就在我决定去的时候,我来到了这个网站.如果您查看任何图像的来源,您会发现它有一个查询字符串,例如width=940&height=320&mode=crop&scale=both&meta=panoramic当我调整窗口大小时,我width=300&height=200&mode=crop&scale=both&meta=square&anchor=topcenter觉得这个网站使用的是Image Resizer,根据屏幕大小,正在处理一张照片由服务器在运行中输出新图像.

我不明白的是,这些方法中的哪一个实际上更好,因为 picture元素仍然需要将多个图像上传到服务器,而imageresizer只需要一个并且它会裁剪大小适合屏幕尺寸的图像.但另一方面,使用该picture元素,服务器不会受到调整图像大小的请求的轰炸,但是可以节省处理和时间的现有照片吗？