29

包含脚本、使用 CDN (Google) 或将它们本地存储在网站的根目录中更快的是什么？

4

7 回答 7

38

如果您指的是核心 jQuery 库，请将 google CDN用于面向 Internet 的站点（而不是内部站点）。

CDN 具有以下优势，您很难与之竞争：

  • 更多服务器
  • 带宽（您无需付费）
  • 地理位置（响应时间较短）
  • 冗余
  • 优化的缓存设置
  • 用户可能已经从那里缓存了文件
  • 并行下载，用户可以同时从您的站点抓取其他内容

尽管您可以像他们一样配置缓存标头，但您可能无法更快地提供文件。话虽如此，图书馆/CDN 只是难题的一部分。您拥有的其他插件和代码也应该通过 gzip进行压缩、组合和服务。

于 2010-04-30T16:31:35.743 回答
6

取决于你的服务器有多快。然而，CDN 可能更快，您的客户端可能已经从另一个网站缓存了该文件。

它会从您的站点卸载大量带宽，但是您依赖第三方的稳定性来维护文件。（虽然我没有看到谷歌很快就会出现问题）

于 2010-04-30T16:30:18.660 回答
4

Google CDN :-)
1) 从缓存的角度优化
2) 用户从更优化的 CDN 节点接收资源

于 2010-04-30T16:31:05.163 回答
4

不幸的是，最近的研究表明，Google 的 CDN 实际上会阻碍性能。

Google 的 AJAX 库 API 试图通过提供公共共享缓存来使用网络效应来提高所有参与网站的性能。然而最近的研究发现，很少有人使用网络来达到临界质量并实际提高网络性能。目前使用网络的开销意味着使用 Google 的 AJAX 库 API 实际上会降低性能。您应该在本地托管 JavaScript 文件。这将增加您的带宽消耗，但会提高页面加载速度。来自Zoompf.com性能报告说明。

另请参阅此处是否应该使用 JavaScript 库 CDN？

于 2010-07-04T11:47:14.987 回答
1

出于其他人所述的原因，我会说 Google 的 CDN。

但是，如果您的目标市场离您的服务器很近，那么从您的服务器提供服务可能会更好。

例如，假设您有一个站点为 OrlandoFloridaPeopleOnly.com/。如果您的服务器托管在佛罗里达州的奥兰多，而 Google 最接近的内容交付服务器位于佛罗里达州的迈阿密和佐治亚州的亚特兰大（这是真的），如果访问者没有缓存副本，您的服务器可能 [可能] 会更快来自 Google CDN 的文件。

请记住，如果您确实从您的服务器向访问者提供静态内容，请尝试通过使用子域或其他方式并行下载。看在上帝的份上……不要为静态内容传输 cookie。

我不确定这个来源有多可靠：谷歌数据中心。所以不一定要指望它。

于 2010-04-30T16:43:44.577 回答
1

将它们存储在 localStorage / web 存储中甚至更快。我创建了一个小型库来做到这一点，结果非常令人信服

  • 从 CDN 加载 jQuery：Chrome 268ms，FireFox：200ms
  • 从 localStorage 加载 jQuery：Chrome 47ms，FireFox 14ms

您可以在https://github.com/webpgr/cached-webpgr.js查看代码，它很小，您可以在几分钟内阅读并理解所有内容。

这是如何使用它的完整示例。

完整的库：

function _cacheScript(c,d,e){var a=new XMLHttpRequest;a.onreadystatechange=function(){4==a.readyState&&(200==a.status?localStorage.setItem(c,JSON.stringify({content:a.responseText,version:d})):console.warn("error loading "+e))};a.open("GET",e,!0);a.send()}function _loadScript(c,d,e,a){var b=document.createElement("script");b.readyState?b.onreadystatechange=function(){if("loaded"==b.readyState||"complete"==b.readyState)b.onreadystatechange=null,_cacheScript(d,e,c),a&&a()}:b.onload=function(){_cacheScript(d,e,c);a&&a()};b.setAttribute("src",c);document.getElementsByTagName("head")[0].appendChild(b)}function _injectScript(c,d,e,a){var b=document.createElement("script");b.type="text/javascript";c=JSON.parse(c);var f=document.createTextNode(c.content);b.appendChild(f);document.getElementsByTagName("head")[0].appendChild(b);c.version!=e&&localStorage.removeItem(d);a&&a()}function requireScript(c,d,e,a){var b=localStorage.getItem(c);null==b?_loadScript(e,c,d,a):_injectScript(b,c,d,a)};

调用图书馆

requireScript('jquery', '1.11.2', 'http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js', function(){
    requireScript('examplejs', '0.0.3', 'example.js');
});
于 2015-03-08T14:45:04.370 回答
0

值得注意的是，Visual Studio 对 Google 的 CDN 的 Intellisense 存在问题。Microsoft 也有一个 CDN，它允许 Intellisense 正常运行。但是，是的，使用 CDN。

于 2010-04-30T16:50:57.277 回答