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