javascript - HTML5 样板页面特定的 Javascript 放置

Question

问题

如果您使用单个 javascript 文件来保存所有脚本，那么您将只用于一个页面的脚本放在哪里？

背景

这可能是一个意见或“最佳实践”问题，但我对其他人的意见很感兴趣:

我正在使用 html5 Boilerplate在一个项目上。他们 recommend为了速度和一致性，您将所有 javascript 放在一个文件 script.js 中。似乎有道理。

但是，我有一些只与单个页面相关的地理定位脚本，与其他页面无关。我是否应该打破惯例，将此脚本放在我调用它所依赖的 javascript 库的页面下方？只需将对相关函数(位于 script.js 中)文件的调用放在它们所依赖的库的链接下方？

谢谢!

Answer 1

html5 boilerplate 的优秀人员建议将所有 javascript 放在 script.js 中，这样浏览器将只需加载该文件(以及 h5bp 使用的其他文件)并允许缓存该文件。

思路是不要拘泥于“推荐”的方式，要考虑与自己的应用相关的事情。

• 这个地理定位文件只会用在这一页上，对吧？它永远不会在其他任何地方使用。
• script.js 文件将在多个页面上使用。

那么，将仅在一个页面上需要的“整个脚本”放在 script.js 文件中就没有意义了。您应该将文件设为外部文件，并在需要它的页面上单独调用它。这将防止您为了该用户可能永远不会使用的功能而膨胀 script.js 文件。

但是，如果您的地理定位功能的“整个脚本”非常小，请将其包含在 script.js 中。如果它没有增加该文件的下载速度，那么将它包含在那里是有意义的。

所有这一切的要点是，我的应用程序的最佳权衡是什么？

我们知道这些事情是真的:

• 缓存的 js 文件很好
• 下载的文件越少越好
• 下载较小的文件比较好
• 维护很重要

一旦您从应用程序的 Angular 考虑了这些事情，决策就会变得容易一些。请记住，以毫秒为代价的决定不会对用户对页面速度的“感知”产生太大影响。