javascript - google lighthouse 如何计算 javascript 评估时间,以及为什么对于不同环境中的相同脚本,它会有很大差异

标签 javascript performance google-chrome-devtools lighthouse

我正在努力提高网站的性能分数。在 diagnostics 下的 Reduce JavaScript execution time 中运行 lighthouse 时,我发现我的几个 js 脚本的 Script Evaluation 时间很长。

如果我在不同的环境中运行 lighthouse,我会得到相同脚本的不同评估时间,这种差异非常大,例如对于一个脚本,它从 1700 毫秒变为 100 毫秒,

我想了解lighthouse 如何计算评估时间,因此我可以努力减少它。

那些 js 文件比其他评估时间较短的文件相对较小,我无法理解。如果重要的话,在分析中我可以看到同一脚本的执行时间是 45 毫秒。

PS- 我知道脚本执行和评估是不同的

非常感谢任何帮助。

最佳答案

Lighthouse 分数在不同的测试和设备中总是不同的,这取决于解析文件和执行的时间,它使用多少内存以及网络成本。这些详细信息已由官员妥善记录。

评估时间是解析和执行发生的地方。

如果你有你提到的小文件,你可以检查是否有任何渲染阻塞代码或其他通常需要很长时间的同步操作。

即使您的性能分析测试的执行时间复杂度很小,也许它可能是网络成本或内存?您可以通过网络选项卡验证它或检查它可以分配多少内存。

脚本评估实际上是页面运行所需的脚本。

因此,最好的方法是确定您的页面在初始加载时运行所需的脚本,并仅优化这部分脚本。如果它包括同步操作,那么它们可能是主要问题。

需要注意的一件事是,如果您有未使用的代码,则不会对它们进行评估,因此您可以仅过滤需要的代码,而不必担心未使用的代码。

不管怎么说,灯塔得分在大多数时候真的是不可预测的。

您可以查看以下来源以获取更多详细信息:

Boot Up time for script

About performance scoring overall

关于javascript - google lighthouse 如何计算 javascript 评估时间,以及为什么对于不同环境中的相同脚本,它会有很大差异,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/66672557/

相关文章:

google-chrome - 开发人员工具 -> 网络中的奇怪 chrome 行为(无法监控 EventStream/服务器发送的事件)

ajax - 处理Chrome + Backbone中的网络错误

javascript - 如何使用 jQuery 在代码标记内添加 pre 标记?

javascript - 多个 JavaScript 函数的作用域

javascript - 在 typescript/javascript 中使用 fetch 读取 JSON

angularjs - ASP.NET MVC Razor View 与 AngularJS

c# - 改善可感知的 WPF 应用程序启动时间

javascript - 在 Chrome 的 DevTools 中检测泄漏的 DOM 节点

javascript - Fabric.js : changing originX in ellipse changes left position

c++ - 如果不使用,双端队列会减慢程序速度吗?