【问题标题】:How to unload image when not 'in view' to save memory?如何在未“查看”时卸载图像以节省内存?
【发布时间】:2012-05-23 14:01:10
【问题描述】:

我有一个很长的图片库,希望能够在移动设备上显示而不会导致浏览器崩溃或导致滚动不顺畅。大量插件可以延迟加载图像,但是有什么可以在不查看图像时卸载图像以节省内存吗?

【问题讨论】:

  • 我会质疑这样的事情的有效性。您知道您有记忆问题,而不是其他问题吗?此外,“卸载”图像可能不一定会从内存中清除它们。
  • 这取决于方法。画廊会是什么样子?

标签: javascript jquery jquery-plugins


【解决方案1】:

这是来自 LinkedIn 工程团队博客文章 LinkedIn for iPad: 5 techniques for smooth infinite scrolling in HTML5 与此问题相关的引述:

UIWebView/Mobile Safari 有strict limits for images。我们的流中充满了大图像,因此我们很快就达到了极限。一种选择是使用 HTML5 Canvas 元素来绘制图像without running into memory issues。然而,我们发现在画布上绘制非常大的图像很慢,因此我们不得不采取另一种方法:每当图像被充分滑出屏幕时,我们将 img 标签的“src”属性替换为非常小的图像。这确保了用于渲染大图像的内存被定期释放。此外,我们确保没有引入empty image src attribute bug

【讨论】:

  • 用小图替换的变通方法很简单也很实用,谢谢提示:)
【解决方案2】:

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

【讨论】:

    【解决方案3】:

    这是一篇较旧的文章,但仍然有帮助:http://www.vargatron.com/2010/08/ipad-html5-js-memory-management/

    为了在图像元素进入和离开视口时附加事件处理程序以将其src 属性替换为实际的img url(在视口中)或占位符url(在视口外),有以下插件:

    http://static.pixeltango.com/jQuery/Bullseye/ http://imakewebthings.com/jquery-waypoints/

    替换src 属性值仍然不能保证浏览器会释放内存,但它是垃圾收集器的一个强有力的提示。无论如何,如果图像没有立即释放,那么如果用户决定滚动回它,它仍然在缓存中。

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2019-04-30
      • 1970-01-01
      • 2014-07-08
      • 2021-12-04
      • 2013-04-03
      相关资源
      最近更新 更多