Javascript错误/不好的做法答案

【问题标题】：Javascript errors / bad practiceJavascript错误/不好的做法
【发布时间】：2009-07-28 19:53:19
【问题描述】：

即使某些功能只在某些页面上需要，让单个 javascript 文件在所有页面上都加载是不好的做法吗？还是应该根据给定页面上的功能拆分文件并仅由需要它们的页面加载？

【问题讨论】：

【解决方案1】：

根据YSlow，文件越少越好，但尽量将每个文件保持在 25k 以下。还要确保缩小或以其他方式减小 js（和 css）文件的大小。如果可能的话，在网络服务器上打开 GZip for js 并设置一个远期过期标头。

请参阅 here 了解 Yahoo Developer 性能最佳实践。

【讨论】：

【解决方案2】：

如果这个文件真的很大，它可能会影响某些用户的感知性能（即下载和渲染时间）。恕我直言，您应该将其分成合理的功能组，每个组具有相似的功能（这样页面只引用他们需要的文件）。

【讨论】：

【解决方案3】：

取决于未使用函数的大小和复杂性。

无论如何，javascript 解析器只存储每个函数的位置和签名。据我所知，它只在执行时被解析。

如果交通对您来说是个问题，请仅包括您需要的那些...

问候

【讨论】：

【解决方案4】：

由于 JS 文件在下载后会被缓存，并且 JS 解析器在大 JS 文件（不是一个巨大的 ;)）和小 js 文件之间没有显示出明显的性能差异，因此您应该使用单文件方法。

另外众所周知，多个js文件会降低性能。

【讨论】：

【解决方案5】：

你最好使用单个 JS 文件，因为浏览器会在第一次请求它之后缓存它（除非他们已经关闭了它，在这种情况下他们应该得到他们得到的东西）。另一件将大大提高您在页面加载时的感知性能的事情是在 Web 服务器中打开 gzip 压缩 - 大多数 JS 文件压缩得非常好。

【讨论】：

【解决方案6】：

我建议使用一个大文件，对于每个文件，浏览器都会启动一个 Web 请求。大多数浏览器，我不太确定已知浏览器的最新版本有多少，只启动一些并发的网络请求。浏览器将等到文件下载完成后再启动下一个 Web 请求。一个大文件将被缓存，其他页面加载速度更快。

正如@Frozenskys 提到 YSlow 指出文件越少越好，雅虎团队提出的主要性能增强之一是尽量减少 http 请求的数量。

当然，如果您有一个巨大的 javascript 文件，需要几秒钟才能下载，最好将其拆分，以防止用户在页面加载前等待几秒钟。

【讨论】：

【解决方案7】：

单个文件意味着单个下载；正如this article 解释的那样，大多数浏览器只允许对单个域进行有限数量的并行请求。尽管您的单个文件会比多个小文件大，但正如其他答案所指出的那样：

您还可以在页面末尾包含脚本以缩短感知加载时间。

【讨论】：