在HTML中嵌入JavaScript或从外部保存JavaScript有哪些优点和缺点

What are some advantages and disadvantages for embedding JavaScript in HTML or saving it externally?

本文关键字：JavaScript 缺点 从外部 HTML 保存      更新时间：2023-09-26

我正在寻找简单的要点答案。我试过在这里到处寻找、谷歌搜索和其他问题，但我永远找不到每种方法的优点和缺点。

这是我从W3Schools得到的关于外部javascript文件的答案

优点

  • 它允许分离关注点-这在简单的页面中不是什么大不了的事情，但随着脚本越来越大，您可以拥有一个单一的html页面。大文件通常不适合的可维护性

  • 它允许缓存-当浏览器从外部加载脚本时（无论是从您的网站还是cdn），它都会缓存文件以备将来使用。这就是为什么cdn是常用脚本的首选。使浏览器在每次加载页面时使用缓存的脚本，而不是构建新的脚本，这使页面加载更快

  • 可读性更强的代码-这与第一个要点有关，但它仍然很重要。我们人类使用的文件越小越好。它更容易发现错误，也更容易将火炬传递给下一个从事该项目或从中学习的开发人员

Cons

  • 浏览器必须发出http请求才能获取代码

可能还有其他特定于浏览器的原因，但我认为主要原因是将代码分离为不同的组件。

使用外部javascript文件的最大优点可能是浏览器缓存，这可以很好地提高性能。

想象一下，你有一个使用MyJsFile.js（一个随机的50kb javascript文件，为你的网站添加功能）的网站。您可以：

  1. 将其嵌入到每个页面中，并将50kb添加到每个页面请求中（不理想）
  2. 将其链接到每一页（<script src="MyJsFile.js"></script>）

第二种选择通常更可取，因为大多数现代浏览器只会获取一次文件，并从浏览器缓存中提供，而不是每次请求都下载。

查看类似的问题：

  • 为什么不在HTML中嵌入样式/脚本而不是链接呢
  • 我什么时候应该使用内联和外部Javascript
  • 把JS代码放在html文件上更好还是放在外部文件中更好
相关文章：