CSS性能:.css文件应该通过资产域提供吗?

时间:2013-01-29 23:25:59

标签: css performance optimization subdomain

我正在阅读CSS Wizardry关于网页优化的文章。 http://csswizardry.com/2013/01/front-end-performance-for-web-designers-and-front-end-developers/

这是一篇很棒的文章。我建议每个人都阅读它。

文章建议CSS处于关键路径,不应通过资产域提供服务。这是因为通过子域服务将导致DNS查找,这需要时间。关键路径=请求页面然后实际看到某些内容之间的时间。

最佳实践要求您应该在子域上分割大量资产,而不是CSS。

然而,当我查看像Facebook或Apple这样的大型网站的源代码时,他们是从子域服务他们的CSS?他们为什么这样做?

<link rel="stylesheet" href="http://static.ak.fbcdn.net/rsrc.php/v2/yz/r/Hwq5_AIg0hW.css" />
<link rel="stylesheet" href="http://static.ak.fbcdn.net/rsrc.php/v2/y-/r/UgmvVXsZ1MP.css" />
<link rel="stylesheet" href="http://static.ak.fbcdn.net/rsrc.php/v2/yY/r/uHqkbF3y3Er.css" />


<link rel="stylesheet" href="http://images.apple.com/global/styles/base.css" type="text/css" />
<link rel="stylesheet" href="http://images.apple.com/v/home/p/styles/home.css" type="text/css" />
<link rel="stylesheet" href="http://images.apple.com/v/home/p/styles/billboard.css" type="text/css" />
<link rel="stylesheet" href="http://images.apple.com/home/styles/home.css" type="text/css" />

2 个答案:

答案 0 :(得分:1)

可能是他们的其他领域的前端性能已经过优化,并且他们拥有各种专用服务器。对于像我这样的帽子,我会在前端获得任何收益,因为这只是我调整渲染时间,而不是整个团队。

我无法告诉你为什么Apple和Facebook会选择做出他们所做的决定,但是我从CSS Wizardry中付诸实践的一切对我有所帮助,所以我不打算争辩。

看起来Facebook正在从一个单独的域提供服务,而Apple则来自子域。

答案 1 :(得分:1)

鉴于您的计算机/局域网/ ISP缓存DNS查找,并且在许多情况下缓存诸如css文件之类的资源,以及Apple和Facebook等网站有大量重复流量的事实,因此使用单独的域更有意义/ subdomains这意味着浏览器可以在需要时并行下载更多资源。此外,如果这些域/子域是无cookie的,则还有其他性能优势。对于像facebook和apple运行的域名一样,域名几乎没有DNS查询惩罚。

yahoogoogle

的一些有用信息