管理离屏图像的内存

Question

我有一个网页，我想要使用html和javascript显示数以万计的图像。每张表格（每行6个）每次只能显示大约24-30张图像，所以我认为我很聪明地编写自己的javascript滚动，例如，当滚动下来时，从第2-3行屏幕的底部被构建，并且动态加载图像，因为它们靠近可视区域顶部的2-3行，并且被删除（使用javascript在整个表格行中删除子节点）。但是，这并没有对我所希望的RAM的保存产生影响，并且在看到几百行之后，由于内存不足，浏览器经常崩溃。

我已经搜索了一些方法来告诉浏览器它可以释放这些对象，但没有成功。我明白，在一些现代化的实现中，你可以让浏览器运行垃圾收集，但这不适用于所有浏览器或完全支持。我可以想象的一件事是，在数十行之后，通过编程方式重新加载页面，同时以某种方式保存状态（cookie，本地存储或url），但我更愿意将它作为一个连续页面，并简单释放由不再使用的图像。什么是正确的方法来做到这一点？

Answer 1

hackartist，

你是绝对正确的，具有基于您的滚动图片的动态加载将是对这一问题的最佳解决方案。但是，为什么重新发明轮子？你所指的是lazy loading。对于这个问题，jQuery和Echo.js库都有流行的解决方案。

由于上述两者都是开源的：您可以参考自己的实现，贡献自己的更好，或者只是使用他们原有的工具！

另外，仅供大家参考，这里有一篇关于Stack Overflow的标题为“What is JavaScript garbage collection?”的好帖子，它可以解释如何为JS实现垃圾收集。这也是Mozilla开发人员网络上的一篇参考文献，标题为“Memory Management”，它解释了如何在不再需要时释放分配的内存。

如果您有任何问题，请让我知道！