什么时候使用Requirejs和何时使用捆绑的javascript?


74

对于网络专家来说,这可能是一个愚蠢的问题。但是我对此有些困惑。现在,我有一个应用程序,使用两个Javascript文件执行不同的任务。现在,我正在使用Javascript捆绑器来合并和缩小所有文件。因此,在运行时将只有一个app.min.js文件。现在,Requirejs用于在运行时加载模块或文件。所以,问题是,如果我已经将所有内容都放在一个文件中,那么我是否需要requirejs?或者在什么情况下可以使用requirejs和/或bundler?

请让我知道是否需要更多详细信息。


1
我不明白为什么您会同时需要两者。难道认为你会?
nnnnnn'9

2
那是一个混乱。什么时候使用什么?还是只需要选一个?
kunjee 2012年

除了延迟加载JavaScript之外,是否还需要功能依赖注入,以便消除对全局变量的需求?在我看来,就像Require在捆绑文件中仍然有用。我错了吗?
帕皮罗

Answers:


28

在许多精通JavaScript的开发人员中,这是一个备受争议的问题。许多其他语言都有一个“编译”阶段,其中整个程序都捆绑在一起进行部署(想到了JBoss的.WAR文件)。来自更传统背景的程序员经常喜欢这种方法。

近年来,Javascript的增长如此之快,以至于很难绘制出准确的最佳实践,但是欣赏Javascript的更多功能特性的人通常更喜欢模块加载方法(例如require.js的用法)。

我写的Frame.js的工作方式与require.js相似,所以我偏向于模块加载器方法。

要直接回答您的问题,是的,一个或另一个。

大多数主张将脚本打包到单个文件中的人都认为,它可以实现更多压缩,因此效率更高。我认为打包的效率优势在大多数情况下可以忽略不计,因为:(1)模块加载时间分布在整个会话中;(2)各个模块的压缩率几乎相同,(3)各个模块可以缓存(4)仅在最终需要它们时才加载脚本,这样您才能为某些用户加载较少的代码,而总体上加载更多的代码。

从长远来看,如果您可以看到动态脚本加载的优势,请使用它。如果没有,请将脚本捆绑到一个文件中。


6
虽然我了解了单独保存文件的好处,但我认为捆绑还可以减少所需的http连接数。随着浏览器和服务器中流水线变得越来越广泛,这可能无关紧要,但是目前这是一个很大的问题。
安德鲁·塞肯

5
如果应用很大,则HTTP连接开销会很快增加。对于我们的应用程序,当我们以解压缩模式运行它并分别加载每个JS文件时,仅需大约15-30秒即可加载页面。在打包模式下,大约需要一秒钟。
马特·格里尔

单个打包的缓存文件显然比获取数十个或数百个文件要快得多,后者永远无法真正确定已加载,或者加载需要多长时间。因此最好将所有内容转储到客户端上。在大多数情况下,单个文件无论如何都不会超过1mb,在压缩和压缩后可能要少得多。因此,单文件FTW。
vsync 2015年

数千个强类型类和一个.swf文件ftw。
Triynko,2015年

48

通常,在开发过程中,仅以其加载形式使用RequireJS。站点完成并准备好部署后,您可以缩小代码。这样做的好处是RequireJS完全知道您的依赖项,因此可以轻松地以正确的顺序缩小代码。这是在RequireJS网站上显示的内容

一旦完成开发并希望为最终用户部署代码,就可以使用优化器将JavaScript文件组合在一起并进行最小化。在上面的示例中,它可以将main.js和helper / util.js合并到一个文件中并最小化结果。


4
我知道这是一个旧线程,但是我偶然发现,因为我有类似的疑问。因此,接下来的问题是,如果您不介意的话-如果我们最终将所有内容捆绑到一个文件中进行部署,那么我的整个应用程序将一口气加载,而不是零碎(按需)。这与AMD矛盾吗?
代码诗人

5
是的,从某种意义上说。但是AMD更具理论性,因为requirejs也关注现实世界的性能问题。单独加载每个模块肯定更干净,更纯净,但将永远耗时:)
Matt Greer 2013年

1
我也把这个问题放在了stackoverflow.com/questions/20515679/…上。也许是这两种方法之间的中间点?
代码诗人

11

这取决于您的应用程序。如果您要使用仅适度的javascript(最小化少于100kb)制作服务器端应用程序,然后进行总捆绑销售,则可能会很好。

但是,如果您要编写一个javascript应用程序,并且其中包含大量代码,那么您的需求将会有所不同。

例如,在我的应用程序中,我捆绑了所有核心文件。jQuery,下划线,主干,我的主要应用程序文件,用户登录系统,布局系统,通知和聊天系统都是我的初始文件的一部分。

但是,我还有许多其他模块,它们不属于初始捆绑包,而是在这些捆绑包之后加载的。

论坛,Wiki,所见即所得,颜色选择器,拖放,日历和一些动画文件是第二类的一部分。您需要对常用和立即需要的内容以及可以延迟的内容做出合理的决定。

如果我立即包含所有内容,我将获得超过mega的javascript,这将是疯狂的,并使初始启动缓慢得令人无法接受。

initSuccess事件从初始文件触发后,第二类开始下载。

但是第二个类别比第一个类别更智能,因为它首先加载更重要的内容。例如,如果您正在查看Wiki,它将先加载Wiki,再加载颜色选择器。

By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.