代码之家  ›  专栏  ›  技术社区  ›  dzhi

对于包含脚本、使用CDN(Google)或在网站根目录中本地存储脚本来说,什么更快?

  •  25
  • dzhi  · 技术社区  · 14 年前

    对于包含脚本、使用CDN(Google)或在网站根目录中本地存储脚本来说,什么更快?

    7 回复  |  直到 7 年前
        1
  •  36
  •   Nick Craver    14 年前

    如果您指的是核心jQuery库, use the google CDN 对于面向internet的站点(相对于内部站点)。

    CDN有以下优势,您很难与之竞争:

    • 更多服务器
    • 带宽(你不用付钱)
    • 地理定位(较低的响应时间)
    • 冗余
    • 优化的缓存设置
    • 用户有机会 已经 从那里缓存文件
    • 并行下载,用户可以抓取 其他 同时从您的网站中获取内容

    尽管您可以像配置缓存头一样配置它们,但您可能无法更快地提供文件。也就是说,图书馆/CDN只是谜团的一部分。其他插件和代码也应该是 minified, combined served via gzip .

        2
  •  5
  •   Aren    14 年前

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

    (尽管我不认为谷歌很快会有问题)

        3
  •  4
  •   Claudio Redi    14 年前

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

        4
  •  3
  •   Duncan    14 年前

    不幸的是,最近的研究表明,谷歌CDN实际上阻碍了性能。

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

    也看这里 Should You Use JavaScript Library CDNs?

        5
  •  1
  •   David Murdoch    14 年前

    我想说谷歌的CDN是因为其他人所说的原因。

    但是,如果你的目标市场与你的服务器非常接近,那么最好是从你的服务器上服务它。

    比如说,你有一个orlandofloridapeopleonly.com/网站。如果您的服务器位于佛罗里达州的奥兰多,而谷歌最近的内容交付服务器位于佛罗里达州的迈阿密和佐治亚州的亚特兰大(这是真的),那么如果访问者还没有来自谷歌CDN的文件缓存副本,您的服务器可能会更快。

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

    我不确定这个消息来源有多可靠: Google data centers . 所以不一定要指望它。

        6
  •  1
  •   select    9 年前

    将它们存储在localStorage/web存储中的速度甚至更快。我已经建立了一个小图书馆来做这些,结果非常令人信服

    • 从CDN:Chrome加载jQuery 268毫秒 ,火狐: 200毫秒
    • 从本地存储加载jQuery:Chrome 47毫秒 ,火狐 14毫秒

    你可以在 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');
    });
    
        7
  •  0
  •   Aaron    14 年前

    值得注意的是,Visual Studio在Google CDN的Intellisense方面存在问题。微软也有一个CDN,它允许Intellisense正常工作。但是是的,使用CDN。