在页面上帮助300+图像，过多地吃处理器

Question

我正在我的网络应用程序中开发图库，我正在创建脚本，当用户滚动到页面底部时，脚本会在底部加载并附加新图像。

但是当图像变成300左右时，附加和滚动过程会消耗太多的处理能力。

这个问题的解决方案是什么？

我看到新的谷歌图片搜索结果中的一切正常。

对不起评论。 ：）

http://pastebin.com/QAYXpWvC

Answer 1

对结果进行分页，或者如果您正在进行“连续滚动”，则需要删除屏幕外的内容（即向两个方向滚动）。

编辑
我调查了一些关于谷歌图片的内容。他们加载了大约430张图片，这些图片在我的机器上为Chrome中的单个标签消耗了600兆的内存。如果你的机器资源不足，你的UI也应该看到性能的高峰，而不仅仅是你的。

Answer 2

仅加载第一个视图中可见的图像。随后在用户向下滚动时使用ajax加载。许多网站都这样做，通过Ajax加载下一页。这与Facebook的做法类似（我在Firefox 3.6.8中观察到）。它为大型相册中的所有图像创建占位符。但是，仅加载当前视图中可见的那些。向下滚动时，它会提取缩略图以填充剩余视图。