前言
一般标签会被放在头部或尾部。
头部 就是
里，尾部 一般指里为什么建议放在尾部
将放在
里，浏览器解析HTML，发现标签时，会先下载完所有这些，再往下解析其他的HTML，在这个过程中就会导致后面的代码等待JS下载解决Deepl降重。JS并发一起下载的。不管JS是不是来自同一个host，浏览器最多只能同时下载两个JS
放在头部，会让网页内容呈现滞后，导致用户感觉到卡。
所以建议放在尾部（标准做法你是放在body里面的尾部，放在外面是不标准的至于为什么建议Google）。
备注：放body在有的时候也不是最优解
所谓编程无绝对，将放在尾部的也有缺点
这是因为放尾部浏览器只能先解析完整个HTML页面，再下载JS。而对于一些依赖于JS的网页，就会出错。
所以，将放在尾部也不是最优解，也可能在某些情况下是万万不能的，具体位置还是要具体分析。
一般的原则是页面使用放最后，插件例如jQuery放
实现下载JavaScript的同时进行HTML渲染
更modern的方式：使用async和defer
这两个属性能让浏览器做到一边下载JS(还是只能同时下载两个JS)，一边解析HTML。
普通
< src="first.js">
处理方式：
停止解析 document.请求 a.js执行 a.js 中的脚本继续解析 document
defer
< src="first.js" defer>
< src="second.js" defer>
处理方式：
不阻止解析 document， 并行下载 d.js, e.js即使下载完 d.js, e.js 仍继续解析 document按照页面中出现的顺序，在其他同步脚本执行后，DOMContentLoaded 事件前 依次执行 d.js, e.js。
async
< src="first.js" async>
< src="second.js" async>
处理方式：
不阻止解析 document, 并行下载 b.js, c.js当脚本下载完后立即执行。（两者执行顺序不确定，执行阶段不确定，可能在 DOMContentLoaded 事件前或者后 ）
结论
两者都不会阻止 document 的解析defer 会在 DOMContentLoaded 前依次执行js文件下载async 则是下载完立即执行，不一定是在 DOMContentLoaded 前async 因为顺序无关，所以很适合像 Google Analytics 这样的无依赖脚本