javascript - 第一次加载页面时移动 Safari 崩溃

Question

我构建了一个大量使用 Javascript 的网络应用程序，最近对其进行了调整以在 iPad 上运行(它需要进行调整，因为它允许通过四处移动鼠标进行绘图，并且在手指松开之前不会触发 onmousedown/onmousemove)。

现在，通过调整，该应用程序可以在 Mobile Safari 上正常运行。然而，我发现了一个问题，我第一次尝试在 iPad 上加载该应用程序时，它经常会导致 Mobile Safari 崩溃。但是，重新打开浏览器并刷新页面可以完美地加载应用程序并且完全可用。在做了一些研究后，我发现 Mobile Safari 崩溃的最常见原因是超过 6MB 的图片或通过 Javascript 加载的多张图片。我的应用程序只使用图像作为图标，所以总图像大小实际上非常小(可能总共不到 100KB)，但是我的 JS 代码是 2.5MB 未压缩和使用 gz 压缩的 350KB(这就是我将它发送到客户)。

我还了解到，通过 CSS 加载图像可以避免由于图像大小限制而导致的崩溃。我认为值得一试，因为崩溃也可能是由于大量图像造成的，而不仅仅是图像总大小。在将我的一些图标更改为使用 CSS background-image 属性呈现后，崩溃似乎已经消失了。我决定更进一步，调整所有其他图标以使用 CSS 背景进行渲染。在将我的所有图像更改为使用 CSS 呈现后，突然间崩溃似乎又回来了。

这让我得出几个可能的结论:

A.) 即使是我所做的部分 CSS 修复实际上也没有帮助，但不知何故我非常幸运并且在重新加载我的应用程序并多次重新启动 iPad 时没有看到崩溃(然后崩溃可能是我的 JS 代码或其他部分页面)

B.) 我在更改其余图标以通过 css 加载时引入了一些其他问题(如果是这种情况，我不希望重新加载页面来解决问题，但确实如此)

C.) 崩溃是由于我的 Javascript 中与图像无关的东西(但为什么它在重新加载后加载并正常工作)

D.) iPad 在尝试一次渲染/解压缩那么多 Javascript 时卡住了(我还没有听说过这是一个问题，但也很少看到这么大的 Javascript block )

有谁知道除了 6MB 图像限制之外还有哪些其他问题会导致 Mobile Safari 在页面第一次加载时崩溃，但第二次不会？

如果有帮助，这是我的网络应用程序的链接(这是通过 JS 加载图像的旧版本):http://www.grafpad.com/grafpad/canvas/demo (它是用 Pyjamas 编写的，这就是为什么有这么多生成的 Javascript 的原因)。

谢谢

Answer 1

您需要记住，与台式机相比，iPad 的性能严重不足。它的内存特别有限。我马上注意到页面上有很多很多脚本 block 。在不完全拆开您的应用程序来尝试找到罪魁祸首的情况下，您可以从合并开始，只是看看它是否只是处理导致崩溃的那么多节点。