Question

我正在寻找帮助，了解iOS上奇怪的加载延迟。我有这个确切的HTML：

<!DOCTYPE html>

<img src="img/potatoes0.png"/>
<img src="img/potatoes1.png"/>
<img src="img/potatoes2.png"/>
<img src="img/potatoes3.png"/>
<img src="img/potatoes4.png"/>
<img src="img/potatoes5.png"/>
<img src="img/potatoes6.png"/>
<img src="img/potatoes7.png"/>

<script src="js/jquery-2.1.4.min.js"></script>

...加上八张相同的土豆图片和一份jQuery，都存放在远程网络服务器上。

此页面在普通浏览器中立即加载，但在加载JS之前，iPhone（或我计算机上的iOS模拟器）中的Safari会等待11秒：

图像全部基本上一次加载，然后浏览器在开始加载JS之前等待大约10秒钟。
我已经向Wireshark确认该请求直到大约十秒标记才会消失，延迟不服务器端。
如果我添加更多图像，延迟会增加（例如延迟到30秒），即使图像仍能在一秒钟内完成所有负载。
如果我添加更多JavaScript文件，浏览器会在延迟后同时加载它们。

到底发生了什么事？

Answer 1

我认为这与jQuery或DOM加载事件无关。

我在运行iOS 9的iPod和iPad上遇到了完全相同的问题。我以为我疯了。

我创建了一个名为test.js的文件，其中包含：

alert("test");

将此作为脚本包含在我的页面底部（就在正文关闭标记之前）在文件执行之前引入了一个重要的延迟。

将文件置于顶部不会导致任何问题，因此我目前唯一的解决方案。

在各种非iOS设备和浏览器上进行测试并未显示此问题。

@Sidnicious你有没有机会用像我这样的简单文件而不是jQuery来测试？

编辑：我找到了一个包含底层JS的热门网站： getbootstrap.com。我在iPod或iPad上访问该网站，刷新页面几次，并在JS加载之前将页面加载冻结10-20秒。

Answer 2

在整个DOM加载之前，jQuery不会触发。

所以，如果你有一堆图像 - jQuery不会触发，直到所有这些都被下载。要加快速度，请尝试延迟加载图片。

有关Javscript的一点注意事项，因为它适用于移动浏览器。如果您正在进行任何类型的滚动 - Javascript将延迟运行直到滚动停止（这是通过减少处理器上的负载来减少移动设备上的电池消耗）。这可能与您的问题有关，也可能没有，但只要在移动浏览器上出现JS问题，就应该注意。

在页面底部

2 个答案: