15

我已经阅读了很多关于 AMD 解决方案的文章，例如 RequireJS 或在 Javascript 中遵循 CommonJS 样式的模块加载器。

假设我有一个应用程序分为这几个部分：

  • 依赖于我使用的框架的应用程序定义
  • 依赖 App 定义和框架的模型 1
  • 依赖 App 定义的模型 2、模型 1 和我的框架

我可以将每个部分编写为 RequireJS 模块或通用 JS 模块，并将我的项目拆分为我想要的多少个文件，但是将每个部分编写为一个模块或将它们拆分为多个文件然后以正确的顺序加载它们有什么好处（以避免依赖性问题）可能将所有文件连接到一个大文件中以减少 HTTP 请求（如 r.js 优化器所做的那样）？

4

1 回答 1

11

在我看来，有三个比较重要的原因：

您可以在不污染全局命名空间的情况下创建和重用模块。全局命名空间污染越严重，函数/变量冲突的可能性就越大。这意味着您定义了一个名为“foo”的函数，而另一个开发人员定义了函数“foo”=其中一个函数被覆盖。

您可以将代码构建到单独的文件夹和文件中，并且 requirejs 将在需要时异步加载它们，因此一切正常。

您可以为生产而构建。RequireJS 带有自己的构建工具，称为 R.JS，它将把你的 JavaScript 模块连接和丑化成一个（或多个）包。这将提高您的页面速度，因为用户将不得不进行更少的脚本调用并加载更少的内容（因为您的 JS 被丑化了）。

您可以看一下这个简单的演示项目：https ://c9.io/peeter-tomberg/requirejs（在 cloud9ide 中）。

要将您的模块构建到单个应用程序中，您所要做的就是安装 requirejs npm 包并运行命令：r.js -o build/build.properties.js

如果有任何问题，请走开。

编辑：

在开发中，将所有模块放在单独的文件中只是构建和管理代码的好方法。它还可以帮助您进行调试（例如“Module.js 第 17 行”而不是“scripts.js 第 5373 行”上的错误）。

对于生产，您应该使用构建工具将 javascript 连接和 uglify 到单个文件中。当您发出更少的请求时，这将有助于更快地加载页面。您提出的每个加载请求都会减慢您的页面速度。你的页面越慢，谷歌给你的分数就越少。页面越慢，您的用户就会越沮丧。您的页面越慢，您获得的销售额就越少。

如果您想了解更多关于网页性能的信息，请查看http://developer.yahoo.com/performance/rules.html

于 2012-08-19T00:47:26.690 回答