WebPageTest :: 加载事件之后如何启动渲染?

WebPageTest :: How can Start Render be after the load event?

什么会导致即使在加载事件已触发后开始渲染仍延迟?

看看这个webpagetest result

如果你在没有 javascript 的情况下检查你测试的页面(F1 > 在 Chrome DevTools 中禁用 Javascript),你可以看到大多数图像都是延迟加载的,这意味着它们通过 JS script checking if the images are in the viewport 加载。如您所见,在没有 JS 的情况下,加载时间线在加载所有资产之后很好。

对于其他资产,例如 JS,您可以添加一个 async or defer attribute 来使您的脚本加载不同步。

最后,一些脚本甚至可以在加载事件之后故意加载,使用 window load 事件上的附件,当它被触发时在正文中写入 <script> 标签 loadJS 举个例子。

顺便说一下,您应该 read that 更好地理解渲染和事件计时的工作原理。

这很可能是一个错误。目前,WebPageTest 上的 iPhone 实例比较新,作者仍在改进它:

The iOS support is just becoming stable though it's still under VERY active development so don't be surprised if there are a few rough edges (and a lot more limitations than the android testing). - Patrick Meenan, 09-09-2015

android 测试更可靠。