就某些 Chrome Dev Tools 关键字的含义而言

Question

我正在努力改进我们应用程序的性能。我是工作表现方面的新手。为了跟踪性能，我使用了 chrome 开发工具。当我使用性能面板记录我的应用程序呈现时，我看到了一些关键字。但我不知道那些意思。

例如，

1. 重新计算样式
2. 复合层
3. 布局
4. 更新图层树
5. 绘画
6. 等...

并提供一些技巧来跟踪我的页面的性能。

谁能帮帮我？

提前致谢。

Answer 1

我编写 DevTools 文档。我们可能可以更好地定义这些术语中的每一个，所以我认为这个问题没有必要投反对票（它目前的投票分数是 -2）。

这是一个很好的资源。每个术语都在 "The Flow Of Things" 部分中定义。

https://aerotwist.com/blog/the-anatomy-of-a-frame/