Google 开发者网络选项卡紫线
Google Developers Network tab purple line
我正在使用 nuxt js，我看到在这条紫色线之后正在下载一些代码：
现在我的问题是这一行显示了什么，为什么下载的代码不会影响我的 Lighthouse 性能得分？
这条线实际上不是紫色的，它是一条红线和一条蓝线并排在一起。
蓝线是“DOM 内容加载”时间，红线是“加载”时间。
“DOMContentLoaded”事件在加载文档和完全构建 DOM 树时触发。
“加载”事件在所有子框架、图像、样式表、脚本等都已下载后触发。 （这会忽略诸如延迟脚本、异步脚本等内容，因为从技术上讲，它们不是初始文档的一部分）
至于在它之后加载的内容，它仍然会影响您的性能，因为它会影响累积布局偏移、总阻塞时间等。这些行仅供参考。
如果您要计算页面的性能，最好使用开发人员工具中的“性能”选项卡。
这可以让您 运行 完整跟踪并突出显示更有意义的指标，例如首次绘制、首次内容绘制、最大内容绘制（在“时间”部分下）和“体验”下的任何累积布局变化" 部分等
我正在使用 nuxt js，我看到在这条紫色线之后正在下载一些代码：
现在我的问题是这一行显示了什么，为什么下载的代码不会影响我的 Lighthouse 性能得分？
这条线实际上不是紫色的，它是一条红线和一条蓝线并排在一起。
蓝线是“DOM 内容加载”时间，红线是“加载”时间。
“DOMContentLoaded”事件在加载文档和完全构建 DOM 树时触发。
“加载”事件在所有子框架、图像、样式表、脚本等都已下载后触发。 （这会忽略诸如延迟脚本、异步脚本等内容，因为从技术上讲，它们不是初始文档的一部分）
至于在它之后加载的内容，它仍然会影响您的性能，因为它会影响累积布局偏移、总阻塞时间等。这些行仅供参考。
如果您要计算页面的性能，最好使用开发人员工具中的“性能”选项卡。
这可以让您 运行 完整跟踪并突出显示更有意义的指标，例如首次绘制、首次内容绘制、最大内容绘制（在“时间”部分下）和“体验”下的任何累积布局变化" 部分等