javascript - 哪个更适合 JavaScript 加载时间：全部压缩到一个大文件中或全部异步加载？

Question

一个简单的问题，我不确定它是否有一个简短的答案！

描述
我有一个要加载到网站中的 JavaScript 文件，这里有一些关于它们的注释：

问题
我听说 224KB 不适合放在一个文件中！它应该被分成几个文件，每个文件最大为 44KB。我不记得我什么时候听说过这个，我不确定将它分成更多文件是否有效，但确实 224KB 需要很长时间第一次加载时，当然要考虑网站加载了图像和 css。

我已将早期加载 JavaScript 文件的需求降至最低，并将其放在底部，到目前为止这是一个很好的进展，但我需要将它与 HTML 同步加载以获得时间来源，并且要做出的决定是：

是还是不是？
将其保存在一个压缩的大文件中？或者将它们拆分成许多压缩文件并异步加载（我知道处理依赖相关的问题）？

score 6 · Accepted Answer

这取决于网站是什么以及首次加载时间对它的重要性。

尽管如此，我可能会从公共 CDN 加载 JQuery 和类似的东西。一大好处是即使他们从未访问过您的网站，它也可能已经被缓存。

Cappuccino 团队是一个文件的大力支持者——他们制作了一个 javascript 框架。使用他们的工具制作的应用程序预计会有一些加载时间。

score 4 · Accepted Answer

从公共 CDN 加载 JQuery 和相关的另一个好处是增加了目的地的请求。我相信客户端被限制为每个域 2 个请求，因此通过从 google 加载 jquery，从 jquery 加载插件，以及来自您自己域的自定义应用程序代码，浏览器可以同时执行这些，而不是等待前两个，然后发出第三次请求。

我想这也增加了对一个大文件的另一项性能改进。即使您只是将该 1 个文件拆分为 2 个，也可以使用来自浏览器的 2 个并发请求来检索它，这可能会缩短加载时间。

score 3 · Accepted Answer

这是我们为使我们的网络应用程序快速运行所做的工作。

主要的 JS 和 CSS 文件被压缩并与 HTML 标记内联。
HTML 的空白被删除，图像data:image/png由 shell 脚本转换为。

大小约为 400kb，但已缓存和压缩。
Web 应用程序的移动版本是相同的，但约为 250kb。这意味着整个应用程序已准备好在单个 http 调用中运行，就像可执行文件一样。

然后第二个 http 调用获取数据（JSON），我们使用PURE将页面中的现有标记用作模板，将其呈现为 HTML。

该应用程序分为模块，这种方式只预加载了常用模块。
其他人在用户请求时来。

score 2 · Accepted Answer

这个问题没有确切的答案。这在很大程度上取决于您如何以及何时使用这些文件。

通常，您只想在页面加载时下载 Web 应用程序普遍需要的 JS 文件。特定于模块或特定于页面的 JS 文件不应在主 JS 下载中压缩，理想情况下应按需加载。

此外，此问题仅在您关心首次用户的用户体验时才有效。无论如何，JS 文件都会被缓存以供其他所有访问使用。

4 回答 4