使用RequireJS加载jQuery - 哪个更好,本地版本还是CDN?

时间:2012-08-27 12:19:34

标签: javascript jquery requirejs cdn

已编辑以澄清:

性能而言(虽然这仍然是一个狂野的术语,我知道),哪个更好 - 通过RequireJS加载本地版本或jQuery的CDN版本?

为了记录,RequireJS online doc包含一些似乎阻止CDN使用的段落,尽管我并不十分确定它的含义:

  

不要在构建中混合使用CDN加载和shim配置。示例场景:   你从CDN加载jQuery但使用shim配置加载一些东西   像Backbone的股票版本依赖于jQuery。当你这样做   构建时,一定要在构建的文件中内联jQuery并且不要加载   它来自CDN。否则,Backbone将在内置文件中内联   它将在加载CDN的jQuery加载之前执行。这是   因为shim配置只是延迟加载文件,直到   加载依赖项,但不执行任何自动包装定义。   构建之后,依赖关系已经内联,shim配置   不能延迟执行非define()'d代码直到以后。   define()'d模块在构建之后可以使用CDN加载的代码,因为   他们正确地将他们的源包装在定义工厂函数中   在加载依赖项之前不执行。所以上课:shim config   是非模块化代码遗留代码的权宜之计。   define()'d模块更好。

理论上,使用CDN jQuery文件会导致另外一个HTTP请求(无法使用r.js与其他JS文件合并),但是可能会带来访问者可能已经从其他人缓存CDN版本的潜在好处他们访问过的网站。

但是,如果我从googled信息中得到了正确的结果,那么 仍然 需要向r.js提供本地jQuery副本,因为生成的缩小的JS文件会仍然需要包含jQuery模块的副本以确保依赖性的一致性。这将导致在本地和CDN上加载jQuery。 (希望我把这部分做对了吗?)

那么,哪种方式更好?

3 个答案:

答案 0 :(得分:6)

简答:避免额外的HTTP请求和DNS查找

最好使用自己的副本并让RequireJS合并文件。换句话说,我认为避免额外的http请求和DNS查找更有价值。

虽然用户可能已经从其他网站的缓存中拥有该文件,但他们很可能不会。即使他们最近去过另一个站点,缓存大小通常也足够小,以至于在一两个正常浏览会话期间,用户可以轻松填满他们的缓存,在这种情况下,旧文件将被丢弃。

我认为你最多只谈论1%的流量,而且已经有高速缓存中的CDN文件,所以只有1%的用户受益。但是,通过组合这些资源并避免额外的http请求,您将使99%的用户受益。相反,如果没有合并,你会损害99%的用户。只是看待这个的另一种方式。

另一个考虑因素是移动用户......移动用户的延迟时间很长,因此额外的http请求和dns查找的RTT成本更高。

答案 1 :(得分:6)

您的requirejs doc quote特别指出使用具有jQuery配置文件的脚本。如果所有脚本都是AMD模块,则可以从第三方CDN动态加载基本依赖项。

缓存命中率并不像你想象的那么高(雅虎我认为对缓存与非缓存状态进行了研究),这意味着你现在必须依赖另一个域进行加载。

好处可能取决于应用程序,分析它将导致最佳答案。例如,如果它是一个包含大量图像的站点,那么jquery的策略就更少了,因为图像加载可能是更明显的性能问题。

我首先要将jQuery优化到构建的文件中并使用AMD模块进行所有操作,所以如果我想委托给CDN,我可以。但是,如果使用requirejs和shim配置,则需要在构建文件中内联基本依赖项,因为已调整的库不会调用define() - 它们不会等待依赖项加载,而是希望它们立即可用。

答案 2 :(得分:4)

这不仅是人们缓存文件的事实。用户代理只能同时从同一个域加载几个文件。因此,从CDN加载JS文件可确保文件同时加载。

这就是他已经拥有该文件的缓存版本的用户的好处。所以对于流行的文件(例如jQuery javascript),我总是从CDN加载它。

如果因任何原因CDN出现故障,您可以随时向本地版本添加备用。

注意

尽管RFC规定用户代理应同时执行最多2个请求,但大多数用户代理现在都忽略此规范。另请参阅SO上的this old (2009) question。请注意,用户代理当前执行更多请求并不会让我感到惊讶。

相关问题