javascript - 在 javascript 中使用像 requirejs 或 commonjs 模块这样的 AMD 有什么好处?

标签 javascript requirejs commonjs

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

假设我有一个分为以下几个部分的应用:

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

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

最佳答案

在我看来,有三个比较重要的原因:

您可以在不污染全局命名空间的情况下创建和重用模块。您的全局命名空间污染得越多,函数/变量冲突的可能性就越大。这意味着您定义了一个名为“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 line 17”而不是“scripts.js line 5373”上的错误)。

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

如果您想阅读有关网页性能的更多信息,请查看 http://developer.yahoo.com/performance/rules.html

关于javascript - 在 javascript 中使用像 requirejs 或 commonjs 模块这样的 AMD 有什么好处?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/12022930/

相关文章:

javascript - 自动提交表单不起作用

javascript - 如何处理 ETIMEDOUT 错误?

javascript - 处理循环依赖

javascript - Webpack 模块依赖项就像 requirejs 中一样

node.js - typescript /Node 意外 token *

browserify - browserify如何处理循环依赖?

javascript - CSS 菜单与 JavaScript 菜单

javascript - 如何通过javascript更改div中的文本

javascript - 声明后访问对象内部的 javascript 属性

javascript - 不进行异步调用的 CommonJS 模块加载器