一、Js 脚本文件
1、脚本位置
浏览器在解析到 <body> 标签之前，不会渲染页面的任何部分。把脚本放到顶部将会导致明显的延迟。
因此推荐所有的 <script> 标签尽可能放到 <body> 标签的底部，以尽量减少对整个页面下载的影响。
2、组织脚本
把多个 js 文件合并成一个，这样只需要引用一个 <script> 标签，可以减少性感的消耗。
3、使用 defer 加载 js
带有 defer 属性的 <script> 标签可以放置在文档的任何位置，对应的 javascript 文件将在页面解析到 <script> 标签时开始下载，但不会执行，直到DOM加载完成。
它不会阻塞浏览器的其他进程，因此这类文件可以与页面中的其它资源并行下载。
任何带有 defer 属性的 <script> 标签的元素在 DOM 完成加载之前都不会被执行，无论内嵌还是外链。
defer 属性仅当scr属性声明时才生效。
<script type="text/javascript" src="file.js" defer></script>
4、动态加载js脚本元素
function loadScript(url,callback){
var script=document.createElement("script")
script.type="text/javascript"
if(script.readyState){ //ie
script.onreadystatechange=function(){
if(script.readyState==="loaded" || script.readyState==="complete"){
script.onreadystatechange=null
callback()
}
}
}else{
script.onload=function(){
callback()
}
}
script.src=url
document.getElementByTagName("head")[0].appendChild(script)
}
5、XMLHttpRequest 脚本注入
创建一个 XHR 对象，使用它下载 javascrip 文件，最后通过创建动态 <script> 标签元素将代码注入到页面中。
注意：下载的 JavaScript 文件必须与所请求页面在同一个域，这样意味 JavaScript 文件不能通过 CDN 下载。
6、使用 LazyLoad 类库
7、LABjs
原文：https://www.cnblogs.com/hq2020/p/14311180.html