CSS /页面加载速度

Question

我只想真正得到一些意见，我正在努力提高网站的加载速度，Google网页快速建议的一种方法就是从每个页面的CSS文件中删除未使用的CSS。

目前我正在为网站上的每个页面使用一个主CSS文件。

我的问题是每个页面都有单独的CSS文件，使整体加载时间更快？我想第一页会加载更快，但是每个页面会有一个不同的CSS文件，这可能最终会导致整个网站访问的时间更长？

另外，pagespeed似乎警告不要包含多个CSS文件，所以我想我无法将它们“分层”起来......

Answer 1

如果CSS文件缓存，则包含多个文件将不会有任何优势。

<强> 注意

有关CSS的性能规则，您可以

1. 尝试缩小CSS

2. 优化CSS Sprites

3. 避免过滤器

4. 避免使用CSS表达式

有关详细阅读，请参阅

Best Practices for Speeding Up Your Web Site

Answer 2

下载并安装YSlow，它可以准确了解您的网页速度以及提高效果的实际步骤。

Answer 3

在这种情况下，有两个优化指令相互矛盾。当然，如果可能的话，你应该减小文件的大小，但你也应该尽可能少的请求。使用全局样式表可减少请求数，但这意味着文件更大。

您只需要了解您的需求。如果需要减少初始加载时间，则应将样式移出全局样式表。如果您需要减少请求数量，则应使用全局样式表而不是单独的页面样式表。

Answer 4

我不会太担心。通过过滤器运行您的CSS以删除注释和空格，了解等padding: 1em 3em .5em 5px等小型快捷方式，确保文件正确缓存，并通过gzipping从您的服务器发送，以及你会没事的。 CSS通常只是有效载荷的一小部分，不值得失眠。

我唯一一次将CSS文件拆分（用于交付给客户端）的时候，如果我的网站有大部分内容需要大多数人永远不会冒险的独特风格：例如，管理部分。

Answer 5

稍微考虑一下典型用户将如何使用您的视线。如果（像许多网站一样）普通用户在继续之前只查看单个页面，那么为每个页面提供专用的CSS文件可能是值得的。

但是，在绝大多数情况下，单个css文件肯定是首选解决方案

Answer 6

无论如何，浏览器都会缓存CSS文件，因此无论是单个文件还是多个文件，在第一次使用后加载所有文件都无关紧要。

Answer 7

只为所有页面使用一个CSS。一旦你的css被缓存，那么一次又一次地下载css将没有任何开销 另外，ad adam说{c}

Minify

Answer 8

DustMeSelectors是您需要的扩展程序。它将遍历您的所有网站（并提供所有这些相互链接）将获取您的css中的哪些选择器未在任何地方使用。