使用 RequireJS 在生产中需要大量小文件是否有意义答案

【问题标题】：Does it make sense to require a lot of small files in production with RequireJS使用 RequireJS 在生产中需要大量小文件是否有意义
【发布时间】：2013-10-03 23:35:16
【问题描述】：

我将每个模块分成不同的文件。有时，模块只是一个小功能。我使用 RequireJS 在生产环境中加载我的 JavaScript 文件。

我的问题是，在生产中，需要大量小文件是否有意义（会提高性能）？将几个文件连接成更大的文件然后需要更大的文件会更好吗？

【问题讨论】：

简短的回答是“不”。 RequireJS 有一个专门的优化器 (r.js) 可以为你创建一个生产包

标签： javascript requirejs

【解决方案1】：

每个小文件都是一个额外的 HTTP 请求，会消耗大量性能。 HTTP 请求涉及大量开销：即 HTTP 标头，如今它们非常大，无法压缩。除此之外，浏览器通常对它们与一台服务器建立的连接有限制，因此会阻止对进一步请求的请求，直到之前的请求完成。

在HTTP 2.0 到来之前，您绝对应该在生产环境中将所有 javascript 连接到一两个大文件中，绝对如此。（例如，Yahoo guidelines 明确表示早在 2007 年！）

当然，您不应该手动执行此操作。 Requirejs 有optimizations 用于生产，你不需要做任何体力劳动。代码的可读性几乎是重中之重。

【讨论】：

“绝对将所有 javascript 连接到一个或两个大文件中”确保排除库或共享资源，或任何可能需要在一个页面上加载但不需要在另一个页面上加载的内容。
你能定义a lot of performance吗？如果我有 10 个 20KB 文件而不是 1 个 200KB 文件，我可能会获得什么性能提升？
@Nunners stackoverflow.com/questions/11011023/…
developers.google.com/chrome-developer-tools/docs/network 有一个漂亮的 HTTP 请求-响应时序图。
@zzzzBov 对于像 jquery 这样的事情，这可能是真的。但是对于应用程序代码，有时最好将所有文件添加到单个包中，即使您没有在同一页面上使用所有文件，因为此文件可以缓存一次。如果缓存正确，在同一个请求中发送这些额外的千字节可以提供比一次又一次请求不同文件更好的体验。根据您所处的位置（例如，从美国以外的美国服务器请求数据），消除 100-150 毫秒的延迟比从第一个请求中消除 50kb 更重要。