javascript - AppCache 在 iOS 上非常慢

Question

我正在开发一个使用应用程序缓存的网络应用程序，一切都在桌面浏览器和 Android 上运行良好(即使是非常老旧和缓慢的 Android 手机)。然而，在 iOS 6 上，在 Safari 和 Chrome 中下载应用程序缓存要花费更长的时间。

我的应用程序缓存总 大小仅为 2.1Mb，而且我拥有非常稳定的 70Mbps(下载)互联网连接。我希望缓存会非常快。

这是我到目前为止的时间:

• 桌面版 Chrome:<1s (Safari 和 Firefox 的时间相似)
• Android 2.3.3 Stock 浏览器:~4s (Chrome 和 Dolphin 的时间相似)
• Android 4.2.2(模拟):~7s(在 PhoneGap 应用内运行)
• iPhone 4S 6.0 Safari:8 分钟!!!(在 iOS Chrome 中也大致相同!!)
• iPad 2 6.0 Safari:如上!!!

所有这些设备都使用相同的 wifi 和互联网连接，我的 iPhone/iPad 在其他方面运行良好(没有本地应用出现互联网速度问题，常规网站加载正常)。 iOS 下的 AppCache 下载速度似乎绝对下降。

这段时间的 window.applicationCache.status 是 appCache.DOWNLOADING，我有一个 progress 事件正在运行，对文件进行计数已下载，所以我确定它不会卡在其他地方。这似乎只是下载所需的时间。给了什么？

附录:iPhone 的运行温度也高得离谱，在此操作过程中电池电量消耗得非常快。似乎有什么导致 CPU 在下载过程中全力运行。

(注意:我无法在此处发布网络应用程序的链接，因为我们仍处于私有(private)测试阶段，但如果您需要在认为能够帮助诊断之前查看它，请发送电子邮件至我在我的个人资料中的地址，我会发送一个链接到该应用程序)。

Answer 1

好的，我在 iOS 模拟器和 Xcode Instruments 的帮助下解决了这个问题。 (我不确定我是否应该将我的解决方案添加到主要问题中，或者作为答案，但我认为我会这样做，因为我的问题已经有点困惑了)。

事实证明，这实际上是一些错误的 javascript 导致了这个问题，但显然只在 iOS 上。

Web 应用程序旨在只有一个页面高度(没有垂直滚动，除了在特定的 DIV 中)，所以除了用于隐藏地址栏的常用标准 JS 代码之外。 ..

        window.addEventListener("load",function() {
            // Set a timeout...
            setTimeout(function(){
                // Hide the address bar!
                window.scrollTo(0, 1);
            }, 0);
        });

...我还添加了以下内容:

        $(document).scroll(
            function(e){
                window.scrollTo(0, 1);
            });

通过查看配置文件结果，我能够看到 很多 时间花费在 scrollTo 上，因此它立即指出这是原因。为什么 scroll 事件被触发这么多，我不知道(这是在没有触摸屏幕的情况下发生的)。

我最初的解决方案是限制该代码，但我现在正在评估我是否需要它。这是我现在修复它的代码(使用 jquery-debounce ，我已经将其用于其他用途):

        $(document).scroll(
            $.throttle(function(e){
                window.scrollTo(0, 1);
            })
        , 10);

应用程序缓存的下载时间现在与Android时间一致。呸!