遇到一个 interesting video关于在 Chrome devtools 中调试渲染性能。在他的类(class)中，Umar 将 html 标签上 CSS 类的更改确定为渲染瓶颈的根源。 Devtools 表明，更改此类可能会影响 html 下面 DOM 中的 3,874 个元素，并触发代价高昂的 recalculate style 操作。
在过去，我将 CSS 类添加到我的 html 或 body 标记中，作为在该级别表达页面状态的便捷方式。
您的 CMS 可能出于同样的目的这样做。例如，在 WordPress 站点中，您可能会看到一堆类，例如 post-template-default single-single-post postid-99999 single-format-standard logged-in category-news subcategory-uk has-hover 在帖子的 body 标签上。
我们应该避免这种做法吗？还是仅当类在 CSS 规则中使用时才会影响渲染性能？
最佳答案
只有应用了 CSS 样式，它才会影响性能。
浏览器供应商花费大量时间试图确保一流的性能，因此处理 CSS 规则以便可以非常有效地扫描它们以进行必要的渲染更改......甚至在应用它们时尝试优化会导致级联的更改回流。
关于html - html标签上的多个类是否总是影响渲染性能？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/46445891/