使用尽可能少的CSS类可以获得很多性能提升吗？

Question

最近我发现了一个移动UI工具包，它使用了很长的CSS类名，似乎不是使用多个类名和CSS继承（例如".container-element-subelement"）。这有很大的性能提升吗？因为以后必须维护这些样式表听起来像是一场噩梦。

Answer 1

您所提到的性能提升应该可以忽略不计（当然，取决于用户的硬件，页面大小和浏览器）。

这里有一些讨论：CSS child selector performance vs. class bloat

Answer 2

答案是肯定会影响表现。

如果你使用.css框架只是为了一个小选项（比如加载所有jquery-ui，只是为了在一个div上做圆角，......非那种。

另外，请更深入地比较：     .this-verry-long-way-too-long-css-selector-to-do-something {} 和     .thisselector {}

• 45个字符差异=很多字节差异，
• 乘以太长选择器名称的数字，
• 乘以服务器发送.css文件的次数 =带宽

你可以使用这个工具： yslow 'firefox plugin'来帮助你学习和调整.css性能

编辑：好的，我理解你的问题。 然后，这是一个与DOM引擎相关的好问题。

所以，我认为如果堆叠基本的简单选择器，DOM引擎的性能会更好。

您可以使用Chrome开发者工具的选择器配置文件（在“配置文件”面板中）来分析浏览器处理页面中选择器所需的时间（匹配+将样式应用于匹配的元素。）

这里有一个文档：http://moduscreate.com/efficient-dom-and-css/

继续