Pagespeed - cdn.com/framework.css + mysite.com/custom.css VS mysite.com/customframework.css答案

【问题标题】：Pagespeed - cdn.com/framework.css + mysite.com/custom.css VS mysite.com/customframework.cssPagespeed - cdn.com/framework.css + mysite.com/custom.css VS mysite.com/customframework.css
【发布时间】：2015-01-09 23:19:11
【问题描述】：

那里有很多 CSS 框架，这可能也适用于 js，但我将使用 twitter bootstrap 作为示例。

是否建议编译将在您的网站上托管的自定义版本的框架（例如使用 sass）
或
使用框架 cdn 和小型主题样式表来覆盖您网站上托管的默认样式？

例如

<!-- bootstrap cdn -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css">
<!-- custom theme -->
<link rel="stylesheet" href="mysite/css/custom-bootstrap-theme.min.css">

或

<!-- custom boostrap -->
<link rel="stylesheet" href="mysite/css/custom-bootstrap.min.css">

【问题讨论】：

标签： performance twitter-bootstrap cdn pagespeed

【解决方案1】：

一般来说，您希望最大限度地减少浏览器为获取资源而必须发出的请求数，因此一个脚本（或样式）优于两个。

但是，您使用的 CDN 可能提供比您自己的服务器更好的延迟和下载速度，在这种情况下，部分获取样式可能会更快（从 CDN 快速下载大部分内容和从您的服务器下载较少内容的速度较慢）。

最好的选项是使用单个脚本（“捆绑包”），该脚本已缩小（就像您所做的那样）和 CDN 化（即您希望从 CDN 提供您自己的脚本，例如 Amazon CloudFront）。

【讨论】：