连接所有JavaScript文件（包括供应商）是否有任何缺点

Question

为了最大限度地减少对我的服务器发出的请求数量并缩短加载时间，我考虑连接所有的JS文件，包括像angular，jquery-ui这样的供应商js文件...... 这是一种常见的做法，但我经常看到不在同一个JS文件中包含供应商JS文件的网站。我知道很多站点都使用CDN来重用其他页面可能使用过的JS文件的缓存版本。但是，有时，它们是在同一服务器上提供的独立供应商JS文件，例如在Github上：

Github：

• 包含Modernizr，jQuery
的Frameworks.js
• github -... js包含来自Github本身的JS。

有特殊原因要这样做吗？它们是否会出现因为您连接所有JS文件而出现的问题？

Answer 1

主要原因是最小化http请求的数量。在一个更大的项目中，如果你使用像MV *这样的模式，你可能想要在外部.js文件中抽象每个模块。例如，这可能导致许多文件30-40。在这种情况下，您可能希望将其连接到单个文件中。

在一个较小的项目中，你将拥有3-4个js文件，然后使用它而不连接。我使用requirejs将模块定义为AMD，并将每个模块都放在外部文件中。然后我使用requirejs构建脚本来管理依赖关系和连接的部署文件。

自动化此过程的好工具

• RequireJS
• GruntJS

Answer 2

取决于您的申请方式。假设，如果你有20个js文件，每个0.5MB。其中第一页只需要2（1MB）。您可能希望将它们分开并与其他组合。在第一页上加载其他延迟模式。因此，当您了解所有要组合的内容时，组合文件是很好的。作为一般规则，如果你的文件很少，那么它确实没有太大的区别。

在组合javascript文件之前你应该考虑的一些事情，

将100个文件组合在一起时。你减少了99个请求。但是你也在做以下事情：
*增加下载单个文件所需的时间（并且可能阻止加载重要页面）
*说明解析我们刚刚提取的其他JS代码所花费的时间     来自服务器，此时甚至可能不需要它。 javascript     引擎越来越快，但它仍然是真的，这是一个重要的     解析javascript代码所花费的时间。

所以，简而言之，答案是 - “它始终是一种权衡游戏，并且知道你的代码很有帮助”：）

http://tomdale.net/2012/01/amd-is-not-the-answer/是类似行的有趣读物。

Answer 3

表现明智，它不会有所作为。如果你为所有框架都有一个单独的文件而烦恼，那么我想你可以做到。否则，您只是填写单个文件，并且在稍后尝试更新框架时可能会遇到问题。