我的 Web 应用程序使用 jQuery 和一些 jQuery 插件（例如验证、自动完成）。我想知道我是否应该将它们粘贴到一个 .js 文件中以便更容易地缓存它，或者将它们分解成单独的文件并且只包含我需要的给定页面的文件。
我还应该提到，我关心的不仅是下载 .js 文件所需的时间，还有页面根据加载的 .js 文件的内容而变慢的程度。例如，即使在缓存时，添加自动完成插件也会使响应时间从我的基本测试中减慢 100 毫秒左右。我的猜测是它必须扫描 DOM 中的元素，这会导致这种延迟。
将 javascript 放在一个 .js 文件中还是将其分解为多个 .js 文件？
IT技术
javascript
2021-02-06 15:17:23
6个回答
我认为这取决于他们多久改变一次。让我们以这个例子为例：
- JQuery：一年换一次
- 第 3 方插件：每 6 个月更换一次
- 您的自定义代码：每周更改
如果您的自定义代码仅占总代码的 10%，您不希望用户每周下载其他 90%。您将至少拆分为 2 个 js：JQuery + 插件和您的自定义代码。现在，如果您的自定义代码占完整大小的 90%，那么将所有内容放在一个文件中更有意义。
在选择如何组合 JS 文件（CSS 也是如此）时，我会平衡：
- 文件的相对大小
- 预计更新次数
常见但相关的答案：
这取决于项目。
如果您有一个相当有限的网站，其中大部分功能都在网站的多个部分重复使用，那么将所有脚本放在一个文件中是有意义的。
然而，在我参与过的几个大型 Web 项目中，将站点范围的通用功能放在一个文件中，并将更多特定于部分的功能放在它们自己的文件中更有意义。（我们在这里讨论的是大型脚本文件，用于多个不同网络应用程序的行为，它们都在同一域下提供服务。）
将脚本拆分成单独的文件的好处是，您不必为用户提供他们不使用的不必要的内容和带宽。（例如，如果他们从不访问网站上的“App A”，他们将永远不需要“App A”部分的 100K 脚本。但他们需要通用的站点范围的功能。）
将脚本保存在一个文件下的好处是简单。服务器上的点击次数更少。用户下载量减少。
不过，像往常一样，YMMV。没有硬性规定。根据用户的使用情况和项目的结构，做对他们最有意义的事情。
如果人们要访问站点中的多个页面，最好将它们全部放在一个文件中，以便缓存。他们会预先获得一击，但这将是他们在您网站上花费的整个时间。
在一天结束时，这取决于你。
然而，每个网页包含的信息越少，最终浏览者下载它的速度就越快。
如果你只包含每个页面所需的js文件，你的网站似乎更有可能更加高效和精简
如果每个页面都需要这些文件，请将它们放在一个文件中。这将减少 HTTP 请求的数量并缩短响应时间（对于大量访问）。
有关其他提示，请参阅雅虎最佳实践
其它你可能感兴趣的问题