Jim*_*ery 26 performance jquery cdn twitter-bootstrap angularjs
在典型的网页上,我从CDN加载以下内容:
从1 CDN(如果可能)或从不同的CDN加载这些更好吗?是否有最佳实践,或者它没有什么区别?
len*_*ndc 14
在使用一个或多个CDN方面,根据Yahoo UI Team的这篇文章,取决于你从同一主机名下载多少组件,这不是问题,HTTP/1.1表明浏览器应该将并行下载限制为两个每个主机名.因此,使用多个CDN源,不同的主机名应该是一个好习惯.
也许在使用相关组件的情况下,为了避免意外版本不匹配(例如角度和角度路由器),您可能希望使用相同的CDN,但是,如果每个主机名的下载增加,则会以相同的方式创建加载泄漏(至少对于遵循规范建议的浏览器).
使用CDN绝对是提高网站加载性能的好方法.但是,您应该考虑使用您可以找到的更流行的CDN,这将增加您从使用相同文件的其他站点获取正在使用的文件的缓存版本的机会,这将增加更多的加载性能.网站.
正如@JeffPuckett在评论中指出的那样,浏览器今天每个服务器/代理的同时下载限制更高:
Run Code Online (Sandbox Code Playgroud)Firefox 2: 2 Firefox 3+: 6 Opera 9.26: 4 Opera 12: 6 Safari 3: 4 Safari 5: 6 IE 7: 2 IE 8: 6 IE 10: 8 Chrome: 6
恐怕这个问题没有灵丹妙药的答案,因为它通常会发生。这是我的 2 美分。与关注同时连接和浏览器/标准的数量相反,我想从不同的角度来看待它。
对您的用户和服务器而言,最重要的是页面加载时间和服务可用性。最快的加载时间是从缓存加载。的更多的用户使用特定的文件从一个特定的CDN,高速缓存命中的机会越多。
基于这个目标,有道理
我会对那些你可以找到流行的 CDN 和使用统计数据的库进行分类,其他的 - 不是那么多,尽管你可以根据其他建议自己决定在本地托管什么。
对于统计,您可能需要使用 w3techs 之类的东西:
在“少量高流量”和“很多低流量”站点之间进行选择可以基于对您的网站受众的一些有根据的猜测,但如果您想确定,您可以尝试测量缓存命中率。这并不简单,但这里我们有一些想法。
现在,对于版本,您是否可以选择更改版本。如果您决定使用第一个选项“很少有高流量”的站点,那么绝对值得从他们使用的 CDN 中检查库的哪个版本。否则,对于“许多低流量”选项,最好使用最受欢迎的版本。同样的 w3tech 应该有统计数据。
这听起来可能很麻烦,但很少这样做(如果不是一次),因为统计数据的变化往往非常缓慢。
接受的答案已经过时了,雅虎的参考文档于 2007 年发布,它与 HTTP/1.1 尤其相关。请参阅 HTTP/2 的正确信息:是否使用 HTTP/2 提高了每主机连接限制?
我会说恰恰相反。最好从同一个主机加载越来越多的资源,在这种情况下是 CDN,如果它支持 HTTP/2。浏览器对 HTTP/2 的支持非常高,在几年内将接近 100%(如果与 HTTP/3 结合)。
此外,使用更多 CDN 加载文件也会产生相关成本:
现在,回答您的具体问题:
从 1 个 CDN 或不同的 CDN 加载这些更好吗? 由于现在所有的 CDN 默认都支持 HTTP/2,如果可能的话,建议使用一个 CDN 来处理越来越多的内容。顺便说一下,有一个 CDN,PageCDN,它就是为了解决这个附带的域分片问题而构建的。他们在单个主机上提供javascript 库、字体和私有 CDN,以充分利用单个 HTTP/2 连接。
是否有最佳实践? 最佳做法是: 1. 减少 DNS 查找。2. 减少连接。与更多 CDN/主机相比,更喜欢更少的 CDN/主机。3.不要捆绑文件。很多开发者会推荐你打包文件,但谷歌浏览器 V8 团队不推荐这样做。4.使用preconnect meta标签节省连接时间。
它没有区别吗? 是的,使用 CDN 会有所不同,因为它可以将其他网站的浏览器缓存用于您的目的,这样即使是您的第一次访问者也可以获得非常快的页面加载。