空闲时间和其他时间。为什么浏览器长时间不活动？

Question

Chrome 开发者工具中“时间轴”选项卡摘要中的“空闲”和“其他”时间包含哪些内容？

是什么导致如此不作为？

为什么会出现这些情况？

如何减少这些时间？可以吗？

为什么浏览器长时间不活动（在空闲时间的情况下）？

开始时超过 1.8 秒没有任何反应：

中间“空闲”和“其他”大约占用0.3秒：

几乎 3 秒结束时什么也没有发生：

在此示例中，浏览器有近五秒的不活动状态...

Answer 1

当浏览器尚未完成页面在屏幕上的最终呈现，但必须暂停该进程，同时等待恢复和完成它所需的丢失数据或资源时，就会出现“空闲”状态。

我们可以处理较长的“空闲”期，例如，当浏览器等待服务器端长时间生成的同步响应时。

“空闲”状态不应与“正在加载”状态混淆，这是浏览器实际上传响应的时间（从第一个字节到最后一个字节），而不是从发送请求到上传响应的时间.

“其他”状态代表除饼图中列出的活动之外的所有浏览器活动的时间，例如 DOM 树构建、CSSOM 等。

这个问题在“渲染树构建、布局和绘制”网站上有部分解释。

Answer 2

我在Addy Osmani 的博客找到了部分答案：

在Frame模式下，阴影竖条对应重新计算样式、合成等。每个垂直条的透明区域对应于空闲时间，至少是页面部分的空闲时间。例如，假设您的第一帧需要 15 毫秒执行，下一帧需要 30 毫秒。常见的情况是帧与刷新率同步，在这种情况下，第二帧的渲染时间略长于 15 毫秒。此处，第 3 帧错过了“真实”硬件帧并在下一帧上渲染，因此，第二帧的长度实际上加倍了。

但这并没有穷尽这个话题。

问题中包含的图表未使用框架的示例。

我还是不知道如何缩短时间，以及“其他”下隐藏着什么。

Answer 3

查看此主题

闲置就是这样，没有发生任何事情，所以据我所知没有什么可担心的。

其他是“未检测的活动”。这是目前无法分解的东西。因此，您无法从 DevTools 分析其中发生了什么。

Answer 4

使用开始分析并重新加载页面按钮而不是记录按钮将给出我们正在等待的结果，因为它会在页面完成加载后停止记录，从而减少

idle

。

Answer 5

高空闲时间是否会导致加载时间过长？

问候