5

我想我要问的是，如果将 JavaScript 分组被认为是一种好的做法，那么为什么更多的网站不将 JavaScript 和 CSS 直接放在一个 HTML 文档中呢？

4

3 回答 3

3

为什么没有更多的网站将 JavaScript 和 CSS 直接放在一个 HTML 文档中

单个文件缓存。

  • 外部文件具有被缓存的优势。由于脚本和样式很少更改（静态）和/或在页面之间共享，因此最好将它们与页面分开以使页面更轻。

    与其下载 500kb 的嵌入 JS 和 CSS 的页面数据，不如加载 5kb 的页面，并从缓存中加载 495kb 的 JS 和 CSS - 节省 495kb 的带宽并避免额外的 2 个 HTTP 请求。

  • 尽管您可以将 JS 和 CSS 嵌入到页面中，但页面很可能是动态的。这将使页面一直加载一个新副本，使每个请求都非常繁重。

模块化代码

  • 想象一个 WordPress 网站。它们是使用世界各地不同开发人员制作的大量小部件构建的。处理塞在一个页面中的这么多代码是可能的，但难以想象。

  • 如果某些代码只是短路或无法在您的站点上运行，则更容易取出链接外部文件的代码，而不是在页面上搜索相关代码并可能意外地从另一个小部件中删除代码。

关注点分离

  • 将 HTML 与 CSS 和 JS 分开也是最佳实践。这样，您处理的不是意大利面条。
于 2012-06-02T05:08:11.967 回答
3

当您在单个文档中有大量代码时，使用这些代码会更加困难，因为您需要更多时间来找到需要更改的字符串。

这就是为什么最好将代码分成单独的文件，每个文件解决自己的特殊任务，然后将它们包含在必要的代码中。

但是，您可以编写一个脚本，它将您的文件从具有许多文件的开发版本连接到具有较少文件的发布版本，但这会带来两个问题：

  1. 人们通常懒得做额外的编码来创建这个脚本，然后当你的项目结构变得更复杂时改变它。

  2. 如果您发现错误或添加了一个小功能，您将需要在开发版本和发布版本中再次重建您的项目。

于 2012-06-02T04:57:23.577 回答
2

他们将它们分开，以便多个网页可以使用同一个文件。当您更改单个文件时，多个页面也可以进行芳香更新。另外，大的 HTML 文件会导致下载时间过长。

于 2012-06-02T05:02:33.560 回答