google-chrome-devtools - chrome 开发工具分析 css 变量

Question

我是使用 chrome 开发工具进行分析的新手。我想知道性能命中 css 变量是否/有多少，所以想将同一页面与服务器端预处理 css 与 css 变量进行比较。

在 chrome 开发工具分析器中，我看到了解析样式表、绘制等活动。在将预处理的 css 与 css 变量进行比较时，有什么建议可以关注哪些分析器活动？

Answer 1

样式计算是您正在寻找的东西。但是，变量对性能的影响很小。它本质上是一个非常快速的内部地图查找。