web-performance - WebPageTest :: 在加载事件之后如何开始渲染？

Question

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

看这个网页测试结果

Answer 1

如果您在没有 javascript 的情况下检查您测试的页面（F1 > 在 Chrome DevTools 中禁用 Javascript），您会看到大多数图像都是延迟加载的，这意味着它们是通过JS 脚本加载的，检查图像是否在 viewport 中。如您所见，如果没有 JS，加载时间线在所有资产加载之后。

同样对于其他资产，例如 JS，您可以添加一个asyncordefer属性来取消同步您的脚本加载。

最后，一些脚本甚至可以在加载事件之后故意加载，使用窗口事件上的附件在它被触发时在正文load中写入标签，例如loadJS所做的。<script>

您应该顺便阅读一下，以更好地了解渲染和事件计时的工作原理。

Answer 2

这很可能是一个错误。目前，WebPageTest 上的 iPhone 实例是相当新的，作者仍在改进它：

iOS 支持刚刚变得稳定，尽管它仍处于非常活跃的开发阶段，所以如果有一些粗糙的边缘（并且比 android 测试有更多的限制），请不要感到惊讶。 - 帕特里克·米南，2015 年 9 月 9 日

android测试更可靠。