Laravel 刀片。根据屏幕大小显示图像大小的最佳方式

Question

对于每条记录，我有两个图像，小尺寸和大尺寸。根据屏幕大小显示图像大小的最佳方式是什么？

我知道我可以使用 css 和 mediaquery 并使用 div display none / block 来显示小图像或大图像，但是通过这种方式，我知道用户 已经下载了这两个图像，即使它们没有显示 ，对吗？然后，页面负载增加。如果是这样，最好的选择是什么？

Answer 1

对于这个问题，最有效的方法是使用User-Agent 来检测客户端是台式机、平板电脑还是移动设备。

我更喜欢使用Mobile_Detect 或jenssegers/agent（基于Mobile_Detect）。

编辑

最近我在我的服务器上安装了Google Pagespeed Module。有一个过滤器 resize_rendered_image_dimensions，它返回具有当前客户端视图大小的图像（正是您要查找的）。

其他一些实现是使用 Javascript 进行延迟加载，并根据视口大小向请求的 url 添加尺寸。