如何在"不在视野中"卸载图像以节省内存？

Question

我有一个looong图片库,我希望能够在移动设备上显示,而不会导致浏览器崩溃或引起不稳定的滚动.加载延迟加载图像的插件,但是为了节省内存,有没有什么可以卸载图像？

Answer 1

这是来自LinkedIn工程团队博客文章LinkedIn for iPad的引用:HTML5中平滑无限滚动的5种技术与此问题相关:

UIWebView/Mobile Safari 对图像有严格的限制.我们的流中充满了大图像,所以我们很快就达到了极限.一种选择是使用HTML5 Canvas元素绘制图像而不会遇到内存问题.然而,我们发现在画布上绘制非常大的图像很慢,所以我们不得不采取另一种方法:每当图像在屏幕上被充分滑动时,我们用非常小的图像替换img标签的"src"属性.这确保了用于渲染大图像的存储器被周期性地释放.此外,我们确保我们没有引入空图像src属性错误.

Answer 2

我认为没有任何办法可以做到这一点。JavaScript 仅保存对 DOM 对象的引用，而这些对象又由浏览器管理。因此，何时释放资源完全取决于浏览器缓存引擎。这些决定不是基于是否存在对此对象的 JavaScript 引用，而是基于加载资源的页面是否仍然处于活动状态。在任何情况下，浏览器都会自动执行缓存管理，并且您无法通过 JavaScript 影响它，因为这意味着与用户文件系统的某种交互，出于安全考虑，在 JavaScript 中仅在极少数情况下允许在明确授权的情况下进行交互。