RequireJS - 优化到多个文件并按需加载

时间:2012-12-10 06:44:10

标签: requirejs js-amd

我们有一个大型单页应用程序,大约有200个模块 -

当我们使用优化器时 - 我们最终得到了一个文件中的所有模块uglified等。 工作得很漂亮。

但我们的是一种多租户应用程序,每个用户都不需要所有200个模块。

我们可以将模块大致划分为50个常用模块,如果用户类型为“A”则需要100个模块,用户类型为“B”等50个模块。

现在,如果用户类型为“B”,则下载的单个优化文件包含100个从不使用的模块。不知怎的,如果我们能够避免这些,那么文件大小会小得多,这会真正提高性能。

总之我正在寻找这个 - 我们有模块组 - 将模块组优化到它自己的文件中 - 根据用户的需要下载相应的文件。

是否可以使用requireJS进行此类优化?

谢谢,J。

2 个答案:

答案 0 :(得分:0)

您可以构建一个基本模块,其中包含启动应用程序所需的所有内容以及大多数用户将看到的内容。 From the docs

  

优化器只会组合数组中指定的模块   传递给顶级需求和定义的字符串文字   调用,或require('name')字符串文字调用的简化   CommonJS包装。因此,它不会找到通过a加载的模块   变量名称

     

...

     

此行为允许在优化后动态加载模块。   您始终可以通过显式添加未找到的模块   优化器使用include选项进行静态分析。

您不希望在那里拥有的所有模块,必须在您的模块中按此要求:

define(["require"], function(require) {
        return function(b) {
            var lib = 'lib'
            var a =  require(lib);
            a.doSomething(b);
        }
    }
);

所以它们不是初始加载的一部分,但在需要时加载。

答案 1 :(得分:0)

听起来好像最好将单页应用分成两个单页应用,共享公共代码,如需要文档Optimizing a multi-page project中所述。

这意味着对于用户类型A和B共享的任何内容,应该有一个HTTP请求,然后对于用户类型A或B,另一个HTTP请求具有特定于该模块类型的模块。