未使用的CSS样式会影响加载时间

时间:2013-03-08 11:20:36

标签: css styles load-time

我想知道未使用的CSS样式是否会影响加载时间,因为我通常会使用这种格式破坏我的代码部分

/*===================
      Nav-Styles
===================*/

但是,我也使用coda来编写代码。它有一个代码导航器,可以检测ID,然后是{}

我认为可能对我的代码组织有帮助的是创建这种中断格式

/*==========================================
  #----NAV-STYLES-BEGIN {} /* Nav Styles */ 
==========================================*/ 

这意味着我的分节符将出现在代码导航器中,并且可以快速跳转。但是,如果这会导致与速度相关的问题,那么手段将超过结束。

这是一个坏主意还是差别如此微不足道,如果我想要它值得做?

3 个答案:

答案 0 :(得分:5)

这里的答案不正确。

未使用的CSS有两件事:

  1. 在引擎开始呈现页面之前添加需要下载的更多字节
  2. 浏览器引擎必须通过每个css选择器来评估它是否在页面上以及它应该如何呈现。
  3. 第二部分至关重要。如果你的css文件的50%是未使用的css,那么你基本上让浏览器引擎需要两倍的时间来渲染页面的CSS。当然,CSS选择器的类型也很重要,所以两倍的长度更像是一个简单的例子而不是完整的事实。尽管如此,未使用的CSS会增加浏览器页面加载时间,即使文件缓存在本地驱动器上也是如此。

答案 1 :(得分:3)

通过网络传递给客户端的任何未使用的CSS或JS都会在很小程度上损害网站的性能。未使用的CSS会增加页面的大小,从而增加下载页面所需的时间。这里和那里的几个字符不会对您的下载时间产生巨大影响,但是如果存在大量未使用的样式,则可能会产生影响。这就是许多人压缩他们的CSS和JS的原因。

答案 2 :(得分:1)

这种影响将是不明显的,并且可以被描述为最多可以忽略不计。无论如何,您可以使用构建脚本删除所有注释并缩小CSS。如果只是轻微的话,这将改善加载时间。

简短的回答 - 选择最容易开发的内容。您可以稍后担心生产。

I hesitate to add