将JavaScript拆分为多个文件或将其全部放在一个文件中是否更好？

Question

假设一个网站在Linux服务器上运行。有三页。一个页面有一个AJAX调用，一个页面有一个JavaScript生成的日历，第三个页面有一个灯箱图像库。它们还共享一些常见的JavaScript函数。

我以前有两种方法可以处理这种设置。方法1：创建四个.js文件。一个具有公共功能（在每个页面上加载），另外三个具有每个不同的页面功能。每个页面加载两个脚本：公共脚本和该页面内容的特定脚本。该页面会发出一个额外的HTTP请求，但不会加载任何无关的脚本。

方法2：将所有内容放在一个.js文件中，每个页面加载一个文件。只有一个HTTP请求，但每个都加载了大量无关的JavaScript（例如，Calendar页面也将加载Gallery页面和AJAX调用页面的脚本）。

假设正确的函数命名等不是问题，那么我们不需要关心函数名称重叠等，哪种场景最适合网站加载时间和整体性能？每页额外的HTTP请求，或每页多个无关的JavaScript？

Answer 1

这取决于您的Javascript大小和用户的数据连接，以及（非）使用HTTP2等技术。

一般来说，答案是将每个单独的Javascript文件合并到一个文件中可以提高性能。没有什么可以说你不能为你的每个页面分别做这个，这意味着你有一个带有页面特定功能的Javascript文件，以及你所描述的常见功能。您可以手动执行此操作，也可以使用gulp等工具自动执行任务。

Answer 2

我会在一个文件中提供它们，因为一个HTTP请求甚至可以加载大量的JS。如果它是一个巨大的JS文件，请考虑缩小。

Answer 3

我会做一个文件，并确保您的服务器响应标头允许客户端缓存。然后，只有一个HTTP文件的HTTP请求，即使他们访问了您网站上的所有页面。