用Javascript加载图像时iPad / iPhone浏览器崩溃

Question

我正在尝试在Safari中建立模仿iPad Photo应用程序的图片库。它运行良好，除了一旦我通过将它们添加到DOM或创建新的Image对象加载了超过6MB左右的图像，新图像要么停止加载，要么浏览器崩溃。这个问题已经很普遍了（其他所有人都达到了相同的极限），我已经排除了将Javascript代码作为罪魁祸首的可能性。鉴于您可以在一个元素中或通过浏览器中的媒体播放器流式传输多于几个MB的内存，此限制似乎是不必要的，并且应该有某种解决方法。也许通过释放内存或其他方式。我也遇到了UIWebView的参考。“ JavaScript分配也限制为10 MB。如果您超出JavaScript的总内存分配限制，Safari就会引发异常。”哪个与我所看到的完全匹配。是否有可能在Javascript中释放对象，或者Safari / UIWebView是否保持运行状态并且永不松手？或者，是否有其他解决方法可以用另一种方式加载数据，而不会占用这10MB的空间？

Answer 1

我从Steve Simitzis和Andrew的建议开始感到幸运。

我的项目：

基于PhoneGap的应用程序，具有6个主要部分以及大约45个子部分，这些子部分的jquery循环库包含2至7张图像，每张图像640 x 440（共215张以上图像）。最初，我使用ajax加载页面片段，但此后我切换到一页页面，所有部分都隐藏起来，直到需要为止。

最初，经过大约20个画廊之后，我得到了内存警告1、2，然后是崩溃。

在将所有图像都作为背景应用到div中之后，我可以在崩溃前通过应用程序中的更多图库（约35个），但是在以前访问过的画廊之后，它最终会失败。

似乎对我有用的解决方案是将背景图像URL存储在div的title属性中，并将所有背景图像设置为空白gif。对于215多个图片，我希望将url保留在html中的某个位置，以便于轻松和快速参考。

当按下子导航按钮时，我将css背景图像重写为div标题标签中包含的正确源，仅用于显示的画廊。这使我不必做任何花哨的javascript来存储正确的源图像。

var newUrl = $(this).attr('title');

$(this).css('background-image', 'url('+newUrl+')'); 

当按下新的子导航按钮时，我将最后一个图库div的背景图像重写为空白gif。因此，除了界面gfx之外，我一直都只有2-7张“活动”图像。对于添加的其他任何包含图像的内容，我仅使用此“按需”技术将标题与背景图像交换。

现在看来，我可以无限期使用该应用程序了，而不会崩溃。不知道这是否对其他人有帮助，它可能不是最优雅的解决方案，但它为我提供了解决方案。