额外的、未使用的 CSS 定义是否会降低浏览器的速度?
在与许多 CMS 合作并切割了许多 HTML 设计之后,当我看到 SilverStripe 对 CSS 的使用时,我被转换了。
本质上,根据您所在的页面更改
标记中的 ID 是一种浪费,并且更改
标记的类和ID 将是更改特定页面的更简单的方法。在以下问题中,一位同事对这种信念提出了质疑:
在一个特定的网站上,我们有各种结构相似的页面。有些可能包含特殊表格,有些可能不包含。所有特殊表单都应该有不同的背景图像,具体取决于我们所在的子部分。
由于声称“额外的 CSS 行会减慢 body.onLoad
s”,我对所有背景进行编码的论点CSS 中的期望被拒绝了。
有人可以引用各种案例之间的证据吗?案例包括: CSS 编码错误,以及 CSS 编码良好,但每个页面上都有各种未使用的 CSS?
(具体来说我的问题,有人能解释我的不安吗?假设图像会在那里并根据数据库中的变量自动生成内联CSS(或基于标题部分的样式标签),我感到不舒服。)
After working with many CMSes and cutting up many HTML designs, when I saw SilverStripe's use of CSS, I was converted.
Essentially, that it would be a waste to change IDs in <div>
tags depending upon the page you were on, and that changing the <body>
tag's classes and ID would be an easier way of changing specific pages.
Such convictions were brought into question by a coworker during the following problem:
On a specific website, we have a variety of pages that are similar in structure. Some may include a special form, and some may not. All special forms should have a different background image depending upon the sub-section we are in.
Due to a claim that "additional lines of CSS slow down body.onLoad
s," my argument to code all background expectations in the CSS was rejected.
Can anybody cite evidence between a variety of cases? Cases including: Badly-coded CSS, and CSS well-coded, but having a variety of unused CSS on each page?
(And specifically speaking on my problem, can anybody explain my unease? I feel uncomfortable assuming images will be there and auto-generating Inline CSS (or header-section-based style tags) based upon a variable from a database.)
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(1)
这并不重要(明显),除非您的网站是 Gmail 或 YouTube(或类似的 CSS 密集型网站)。
Google 在其 Page Speed 指南中提供了一些建议:
http://code .google.com/speed/page-speed/docs/payload.html#RemoveUnusedCSS
关于这一点:
额外的时间约为几毫秒。做更容易和可维护的事情,而不是更“高效”的事情。
It's not going to matter (noticeably) unless your website is Gmail or YouTube (or is similarly CSS heavy).
Google has some recommendations in their Page Speed guide:
http://code.google.com/speed/page-speed/docs/payload.html#RemoveUnusedCSS
Concerning this:
The extra time is in the order of a few milliseconds. Do what is easier and maintainable, not what is more "efficient".