如果我们比较网页和链接的JavaScript文件的这两个选项：
<script src="...">放在网页末尾，而对<head>部分，但使用<script defer src="...">并且如果the mechanism of how defer works is as described in this page，defer，this other page和那个on Mozilla，那么使用上面的选项＃2岂不是更好吗？
原因是，选项1和2的工作原理完全相同，除了选项2，JavaScript文件的下载可以与HTML文件的解析（和渲染）并行进行。因此，如果下载时间为0.2s或0.5s，则可以节省此时间。如果JS向页面添加元素或启动页面中的任何动态或交互式元素，则对于SPA（单页面应用程序）或旧式时尚网页而言，这都是正确的。
[唯一的例外是，如果浏览器足够聪明，可以在解析上述选项1中的整个HTML文件之前，已经“收集”了所有JS文件的URL，并在将HTML文件解析到末尾之前以静默方式下载了它们，或者到defer is supported in almost all modern browsers标签的位置。但这将使选项1和2完全相同，因此对于不执行此操作的浏览器，选项2仍然会更快？
P.S。话虽如此，我认为有一个陷阱：由于HTTP / 1.1规范建议浏览器一次最多从同一主机名下载2个项目，因此，如果正在下载JS文件并占用一个位置，则某些图像文件可以到达比较慢。 （如果JS和图像来自相同的主机名）
如果比较网页和链接的JavaScript文件的这两个选项：将所有
关于JavaScript
执行
将defer脚本放在顶部或底部几乎没有区别（尽管<script>）。但是请注意，延迟脚本按顺序执行，因此页面中间的任何其他延迟脚本将在头部的延迟脚本之后和页面底部的延迟脚本之前执行。通常，在使用defer时，您无需关心执行时间，但是如果存在依赖关系，则排序可能很重要（即在需要jQuery的脚本之前加载jQuery），而defer则遵循排序（而it’s different for async scripts则不需要）。 但是可以，下载会导致其他因素受到影响。是的，该规范建议最多使用两个连接，但实际上，HTTP / 1.1的连接为async。这意味着，如果您的低优先级defer脚本使用的是其中之一，则该页面上的所有其他内容仅剩下5个连接。页面上的优先级资源可能比async脚本高，因此这很浪费。浏览器将在HTML中向前扫描以获取所有资源的列表，并为每个资源分配优先级（对于most browsers use 6 connections脚本来说这是较低的），但与此同时，浏览器将开始从顶部删除项目优先队列的优先级和头中的低优先级defer脚本可以在看到其他资源之前启动。而且由于有了这种“预加载扫描程序”，将defer脚本放在头部的任何好处都是最小的。浏览器仍会看到它，并在可能时请求它。是的，在底部看到它的时间会稍长一些（特别是对于大型页面，可能需要一段时间才能完全下载），但即使HTML完全下载，它仍然会在完整下载后立即看到处理页面上的脚本和其他资源，因此还没有到达HTML的末尾。
在HTTP / 2的世界中，没有6个连接的限制，您可能会认为这没什么关系，但通常会如此。部分原因是连接限制不是完全无限的（在HTTP / 2服务器上100或128个并行流是常见限制），而更多原因是带宽不是完全无限的，因此下载争用是真实的。 HTTP / 2具有优先级的概念，因此从理论上讲应该能够很好地处理此问题，但是defer您不能依赖它。
defer。如果对这种事情感兴趣，非常值得一看。
因此，总之，我现在仍将延迟脚本保持在页面底部。