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

时间:2015-01-09 14:59:32

标签: performance twitter-bootstrap cdn pagespeed

有很多CSS框架,这可能适用于js,但我会使用twitter bootstrap作为例子。

是否建议编译将在您的网站上托管的框架的自定义版本(例如使用sass) OR
使用框架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">

OR

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

1 个答案:

答案 0 :(得分:2)

一般来说,您希望尽量减少浏览器获取资源所需的请求数,因此一个脚本(或样式)优于两个。

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

最佳选项是使用单个脚本(&#34; bundle&#34;),它被缩小(就像你已经完成)和CDNified(即你想要你自己的脚本从CDN服务,例如Amazon CloudFront)。