gpt4 book ai didi

javascript - 为什么串联的 RequireJS AMD 模块需要加载程序?

转载 作者:IT王子 更新时间:2023-10-29 03:11:47 26 4
gpt4 key购买 nike

我们在开发过程中喜欢 RequireJS 和 AMD,我们可以在其中编辑模块,在浏览器中点击重新加载,并立即看到结果。但是当需要将我们的模块连接到一个文件中以进行生产部署时,显然必须仍然存在 AMD 加载器,无论该加载器是 RequireJS 本身还是它的较小伙伴“almond”,如下所述:

http://requirejs.org/docs/faq-optimization.html#wrap

我的困惑是:为什么需要加载程序?除非您有非常特殊的情况需要在模块内部调用 require(),否则一系列 AMD 模块似乎可以在根本没有加载程序的情况下连接起来。最简单的示例是一对模块,如下所示。

ModA.js:

define([], function() {
return {a: 1};
});

ModB.js:

define(['ModA'], function(A) {
return {b : 2};
});

鉴于这两个模块,连接器似乎可以简单地生成以下文本,而不会给生产服务器或浏览器带来 RequireJS 或 Almond 所需的额外带宽或计算负担。

我想象一个连接器产生(我使用人字形引号 «,» 来显示上面两个模块的片段被插入的位置):

(function() {
var ModA = «function() {
return {a: 1};
}»();
var ModB = «function(A) {
return {b : 2};
}»(ModA);
return ModB;
})();

据我所知,这将正确地重现 AMD 的语义,同时使用最少的无关粘附 JavaScript。有这样的连接器吗?如果不是,我会不会认为我应该写一个傻瓜——真的很少有代码库由用 define() 编写的简单干净的模块组成,并且永远不需要进一步的 require() 内部的调用会启动以后的异步代码获取吗?

最佳答案

AMD 优化器不仅可以优化要下载的文件数量,还可以优化内存中加载的模块数量。

例如,如果您有 10 个模块并且可以将它们优化为 1 个文件,那么您就可以节省 9 次下载。

如果 Page1 使用所有 10 个模块,那就太好了。但是如果 Page2 只使用 1 呢? AMD 加载器可以延迟“工厂函数”的执行,直到模块被require。因此,Page2 只触发一个“工厂函数”来执行。

如果每个模块在被require时消耗 100kb 的内存,那么具有运行时优化的 AMD 框架也将为我们在 Page2 上节省 900kb 的内存。

这方面的一个例子可以是“关于框”样式的对话框。它的执行被延迟到最后一秒,因为在 99% 的情况下它不会被访问。例如。 (松散的 jQuery 语法):

aboutBoxBtn.click(function () {
require(['aboutBox'], function (aboutBox) {
aboutBox.show();
}
});

在您确定有必要之前,您可以节省创建与“关于框”关联的 JS 对象和 DOM 的费用。

有关详细信息,请参阅 Delay executing defines until first require对于 requirejs 对此的看法。

关于javascript - 为什么串联的 RequireJS AMD 模块需要加载程序?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/10987674/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com