1

最近我遇到了一个使用很长的 CSS 类名的移动 UI 工具包,似乎没有使用多个类名和 CSS 继承(例如".container-element-subelement")。这样做有很大的性能提升吗?因为以后必须维护这些样式表听起来像是一场噩梦。

4

2 回答 2

1

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

这里有一些讨论:CSS子选择器性能与类膨胀

于 2013-01-25T17:12:50.057 回答
1

那么答案是肯定的,它会影响性能。

如果您使用 .css 框架只是为了一个小选项(例如加载所有 jquery-ui,只是为了在单个 div 上制作圆角,... non-sence.

另外,更深入地比较一下: .this-verry-long-way-too-long-css-selector-to-do-something {} 和 .thisselector {}

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

您可以使用该工具:yslow 'firefox plugin' 来帮助您学习和 tweek .css 性能

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

所以,我认为如果堆叠基本的简单选择器,DOM 引擎会表现得更好。

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

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

继续

于 2013-01-25T17:25:30.330 回答