引用单独的JS文件与一个JS文件
[英]Referencing separate JS files vs one JS file
问题描述
这将提高速度/效率：为目录中的所有文件引用一个JavaScript文件或为目录中的每个文件引用不同的JavaScript文件？
所以基本上，在所有网页中引用相同的JavaScript文件与每个网页的唯一JavaScript文件相对应。
注意：我认为引用单个文件会比较慢，因为那里的代码已经过时了，因此运行无用的代码并导致文件运行效率降低。
2 个解决方案
解决方案1
8 已采纳 2015-08-16 08:18:15
需要进行权衡，因此您最终可能需要测量您的具体情况。 但是，我将解释一些权衡。
如果您有大量数据或大量代码仅在一个或几个页面中使用，那么您可能希望将其分离到自己的文件中，这样您就可以只加载它，初始化它并使其占用实际需要时的记忆。 但是，请注意现代计算机（甚至现在的手机）中的内存量，数据或代码必须非常大才能保证单独下载。
除了第1项之外，您几乎总是希望优化以获得最大的缓存效率。 从缓存中检索文件（甚至是比需要的文件更大的文件）比通过网络检索任何文件（甚至是小文件）要快得多，这些文件是您真正想要优化缓存的。 并且，检索这些文件的时间通常使JS解析时间相形见绌（这些天CPU速度相当快），因此触发额外下载以节省一些JS解析时间不太可能更快。
优化缓存的最佳方法是让大多数页面引用相同的公共脚本文件 。 然后，当观众第一次访问您的站点并且所有后续加载都来自浏览器缓存时，它们会被加载一次。 这是理想的。 这种缓存效率很容易克服在主文件中有一些未使用或未触发的代码，这些代码在某些页面中没有使用。
许多小的下载（甚至来自缓存）的效率低于一个较大的下载。 更多单独的请求通常对浏览器或服务器来说效率不高。 因此，将JS文件组合成更大的连接文件通常是件好事。
所有这一切都有限制。 如果你有100个单独页面的完全独立的代码，所有这些代码连接在一起，每个代码段都会在DOM中搜索多个页面元素（并且99％的时间都找不到它们），那么这可能也不是一种有效的方法。 但是，通常您可以通过基于高级类名将内容分成几类来使您的共享代码更加智能化。 因此，例如，基于
<body>标记上是否存在类名，您将只运行部分初始化代码，跳过其余部分，因为它的分类不存在。 因此，当组合代码时，其中大部分代码在任何给定页面上都不相关，明智的做法是如何确定共享文件中的实际运行初始化代码。
解决方案2
3 2015-08-16 06:51:44
您需要根据具体情况进行衡量 - 因为每个站点/页面在加载较少文件/加载额外不必要的脚本之间都有自己的平衡（同样适用于CSS）。
通常单个文件在HTTP v1中更快，因为并行下载总数有限制，HTTP v2应该消除差异。
Wordpress - 处理单独的文件（php、css 和 js），还是将它们全部合并到一个文件中？
[英]Wordpress - Work separate files (php, css and js), or merge them all into one file?
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.