javascript - 图片加载时滚动缓慢

Question

我有一个图像管理器，它显示固定大小的图像网格。缩略图已经相对较小，所以我真的不能把它们变小。我实现了延迟加载并使用去抖功能来检查图像是否在可见区域。这提高了启动我的图像管理器的速度。但是，如果我在加载新一批图像时滚动，滚动会变得非常慢。有没有办法解决这个问题或进一步优化加载图像？

编辑:

有没有办法在新一批图像传入时防止滚动？有点像 Youtube 如何在我们试图滚动查看更多评论时不断弹跳，而它们仍在加载中？

Answer 1

尽量不要一次加载所有图像(我猜你已经用延迟加载实现了)，我知道在线用户很容易快速滚动。

我建议，这里有几件事:首先

1. 以正确的方式实现延迟加载至关重要。 here is a list of few best techniques, make sure which works best for you .
2. 您已经提到，缩略图相对较小，但我认为仅指定较小的尺寸是不够的，我希望您已经涵盖了这一点，否则请维护两个文件夹，一个存放实际图片，另一个存放托管服务器上的缩略图。
3. 即使我们非常小心，用户还是会在我们的服务器上上传大量大图片，如果是这种情况，您需要在客户端调整图片大小，然后再上传到服务器，实际图片中的一份副本 和另一个用于缩略图
4. 如果您谈论的是产品图片，请保留 PNG，为什么，因为它们比 BMP 和 JPG 好得多。您也可以使用在线工具压缩它们，例如 https://tinypng.com/或使用类似 https://pngquant.org/ 的软件

希望这有助于解决您的问题，因为它确实解决了我的问题。

--N Baua