Javascript构建处理大型对象的系统

我有一个巨大的Javascript web应用程序，它开始成为管理一切的麻烦。我将所有内容分解成小文件，每个文件都有自己的应用程序部分

如果应用程序名为“myApp”，我有一个名为

myApp.ajax.js，其中包含

myApp.ajax = (function(){return {/*stuff*/}})();

myApp.canvas = (function(){return {/*stuff*/}})();

有一个打电话来

myApp.canvas.js，其中包含

myApp.ajax = (function(){return {/*stuff*/}})();

myApp.canvas = (function(){return {/*stuff*/}})();

诸如此类。当我连接所有文件并缩小它们时，我会把所有这些都弄得乱七八糟。所以我想知道，是否有一个构建系统可以将所有这些int转换为一个int

var myApp = {
   ajax: /*stuff*/,
   canvas: /*stuff*/,
   /*etc*/
}

当它编译所有东西的时候

---

我这样问是因为我做了一个小测试，发现当对象的每个部分分离时，性能会严重衰退。测试就在这里：

我不确定我是否明白这一点。连接和缩小JavaScript总是以相当混乱的状态结束（至少在阅读上是如此）。只要确保先连接然后缩小，然后使用的编译器就可以优化整个过程

---

至于性能问题。JSPerf测试告诉我，您附加模块的方式大约慢12%（至少在Firefox中，似乎与V8不同）。但在应用程序加载时只执行一次，而不是1000000次。这只会在页面加载时的几微秒内产生影响。

从我从你的问题中收集到的信息以及我所看到的情况来看，人们倾向于使用

make

将多个js文件整理成一个文件，然后对其进行压缩，等等参见是的，有一种方法可以为您处理连接之类的事情。

这是真的。我想差别可以忽略不计。谢谢