css - 多少多个样式表减慢了网站的速度?

标签 css performance xhtml

这里有3个css文件(一个只针对IE)

<link rel="stylesheet" href="css/blueprint/screen.css" type="text/css" media="screen, projection">
<link rel="stylesheet" href="css/blueprint/print.css" type="text/css" media="print">    
<!--[if lt IE 8]><link rel="stylesheet" href="css/blueprint/ie.css" type="text/css" media="screen, projection"><![endif]-->

如果我在我的网站中将 scree.css 分成这些 css

现在它将是 6 个 css(一个仅用于 IE)

<link rel="stylesheet" href="css/blueprint/reset.css" type="text/css" media="screen, projection">
<link rel="stylesheet" href="css/blueprint/grid.css" type="text/css" media="screen, projection">
<link rel="stylesheet" href="css/blueprint/typography.css" type="text/css" media="screen, projection">
<link rel="stylesheet" href="css/blueprint/forms.css" type="text/css" media="screen, projection">
<link rel="stylesheet" href="css/blueprint/print.css" type="text/css" media="print">    
<!--[if lt IE 8]><link rel="stylesheet" href="css/blueprint/ie.css" type="text/css" media="screen, projection"><![endif]-->

如果我在网站制作完成后仍采用方法二。它真的会降低网站页面加载速度吗?如果是那么多少钱?这 3 个额外的样式表会对网站性能产生多大影响?

最佳答案

将它们组合到一个样式表中可以减少浏览器加载页面所需的 HTTP 请求数。但是,在第一次请求样式表后,假设您已正确配置缓存指令,浏览器应该将其缓存,因此后续页面加载不会有太大差异。

使用类似 Google 的工具 PageSpeed插件或雅虎的 YSlow在网站的大部分内容就位后找出实际上导致性能问题的原因,并优化重要的事情。在那之前不要担心。

关于css - 多少多个样式表减慢了网站的速度?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/2748484/

相关文章:

css - 未加载粗体 @font-face

具有多次计算的Mysql查询变慢

javascript - 如何从p :dialog header attribute引用javascript变量

css - 是否有任何仅在 XML 序列化中受支持的 HTML 5 构造?

JavaScript 执行时间非常慢 - Chrome

java - EPUB文件生成,封面页

Android - WebView 中来自 android_assets 的 html,CSS 未在 ICS 中加载

html - DIV 左上角 CSS 动画后的额外像素

JavaScript 不工作。显示无法读取属性

c# - 按位检查和相等检查哪个更有效?