如何动态优化在页面上加载10张以上全尺寸图像？

Question

在我的页面上 ，我一次动态加载10张图片。 在大多数情况下，这些图片的大小超过3000px，我只是调整它们的大小。 加载更多图像（无限滚动）时，除非由于内存消耗，否则页面会变得很漂亮。

有没有一种方法可以真正快速地优化图像？ 我当时在考虑使用API​​进行图像压缩，但是我认为这不是最有效的方法。 我正在尝试不必实现服务器（不是我不能，但是我不想）。

有任何想法吗？

Answer 1

最好的方法是调整服务器上图像的大小。 可以使用https://github.com/willnorris/imageproxy之类的“图像代理”或某些SaaS即时完成。 并且，为了减少服务器上的负载，您可以添加CDN，例如CloudFlare（免费）或CloudFront。