外部 JavaScript 文件优于内联 JavaScript 的缺点答案

【问题标题】：Cons of external JavaScript file over inline JavaScript外部 JavaScript 文件优于内联 JavaScript 的缺点
【发布时间】：2010-10-09 20:48:42
【问题描述】：

与将 JS 作为 ASPX 页面的一部分相比，使用外部 JS 文件有哪些缺点？

我需要做出架构决定，并从同事那里听说外部 JS 有时表现不佳。

【问题讨论】：

【解决方案1】：

请他们定义“玩得好”。除了更好的逻辑组织之外，外部 js 文件在已经缓存的情况下不必传输。

在进行生产/暂存构建时，我们使用 YUI compressor 自动缩小外部脚本并将其合并为一个。

【讨论】：

【解决方案2】：

我知道的唯一缺点是需要额外的 HTTP 请求。一旦 Javascript 被两个页面使用或页面被同一用户重新加载，这个缺点就会消失。

【讨论】：

【解决方案3】：

一个缺点是浏览器无法缓存页面中的 JS。如果您在外部引用它，浏览器将缓存该文件，并且不会在您每次点击页面时重新下载它。嵌入它只会增加每个页面的文件大小。

还需要牢记可维护性。如果是普通的 JS，当您需要更新 X 个 HTML 文件的脚本块而不是一个 JS 文件时，进行更改会更痛苦。

就我个人而言，我从未遇到过外部文件与嵌入式文件的问题。唯一一次我在 HTML 本身中有 JS 是当我有一些东西要绑定到专门为该页面加载的文档时。

【讨论】：

【解决方案4】：

我知道的唯一缺点是必须向服务器发出另一个请求才能检索外部 JS 文件。正如我之前所说，您可以使用 YUI 压缩器之类的工具来最大程度地减少这种影响。

然而，优点是您可以将所有 JS 代码保存在单独的更易于维护的格式中。

【讨论】：

【解决方案5】：

外部 javascript 的另一个巨大优势是能够使用 Jslint 检查您的语法。再加上缩小、合并和缓存外部脚本的能力，内部 javascript 似乎是一个糟糕的选择。

【讨论】：

【解决方案6】：

缓存如果处理不当，既是优点，也可能是缺点。

pro 很明显，因为它会在第一个页面加载之后的每个页面加载时改善页面加载。

缺点是当你发布新代码时，它可能仍然被用户的浏览器缓存，所以他们可能无法得到更新。这可以通过更改 js 文件的名称轻松解决。我们自动使用文件的时间戳对我们的 js 进行版本控制，然后通过我们的 Web 服务器（mod_rewrite，Apache）上的配置确保它指向 Web 请求中的创建文件。

【讨论】：