一、非同步載入
非同步載入又叫非阻塞，瀏覽器在載入執行 js 同時，還會繼續進行後續頁面的處理。
非同步載入js，按需載入，用到的時候再載入，不用到不載入。
非同步載入的三種方式：
1.defer屬性：在文件完成解析完成開始執行，並且在domcontentloaded事件之前執行完成。僅支援ie，最好是外部的script使用。
2.async屬性：載入完就執行，只能載入外部指令碼，是w3c的標準。高版本的瀏覽器支援載入內部指令碼，但是標準中不允許。
3.建立乙個script標籤，插入到dom中。相容性最好。
非同步載入禁止使用document.write()，因為document.write()有可能會清空文件流
二、載入時間線
1.建立document物件，開始解析web頁面。解析html元素和他們支援的文字內容後，新增element物件和text節點到文件中，這個節點document.readystate=「loading」。
2.遇到link外部css，建立執行緒載入，並繼續解析文件。
3.遇到script外部js，並且沒有設定async，defer.（同步載入）瀏覽器載入並阻塞，等待js載入完成並執行該指令碼，然後繼續解析文件。
4.遇到script外部js，並且設定有async,defer（非同步載入），瀏覽器建立執行緒載入，並繼續解析文件。對於async屬性的指令碼，指令碼載入完成後立即執行。（非同步載入禁止使用document.write() ）
原因： 相當於html文件輸出到頁面，當整個文件解析差不多的時候，再呼叫document.write()方法的時候，它將之前的所有文件流清空，將當前的文件流輸出
5.遇到img等，先正常解析dom結構，然後瀏覽器非同步載入src，並繼續解析文件。
6.當文件解析完成（domtree剛建立完），document.readystate=「interactive」;
7.文件解析完成後，所有設定defer的指令碼會按照順序執行。
8.document物件觸發domcontentloaded事件，這也標誌著程式執行從同步指令碼執行階段，轉化為事件驅動階段。
9.當所有的async的指令碼載入完成並執行後，img等載入完成後，document.readystate=「complete」,window物件觸發load事件，頁面所有的內容解析完成 載入完成。
10.從此，以非同步響應方式處理使用者輸入，網路事件等。
js 同步載入，非同步載入和載入時間線
常預設的是同步載入 同步模式又稱阻塞模式，會阻止瀏覽器的後續操作，相當於阻止了後續的檔案的解析，執行等。載入到js檔案會等候js檔案載入完成，html css載入線被阻斷 瀏覽器之所以會採用同步模式，是因為載入的js檔案中有對dom的操作 重定向，輸出document等預設行為，所以同步才是最好的。...
JavaScript 非同步載入，時間線
非同步載入 先了解下同步載入 我們平時最常使用的就是這種同步載入形式 同步模式，又稱阻塞模式，會阻止瀏覽器的後續處理，停止了後續的解析，因此停止了後續的檔案載入 如影象 渲染 執行。js 之所以要同步執行，是因為 js 中可能有輸出 document 內容 修改dom 重定向等行為，所以預設同步執行...
js載入時間線
建立document物件，開始解析web頁面。解析html元素和他們的文字內容後新增element物件和text節點到文件中。這個階段 document.readystate loading 遇到link外部css，建立執行緒載入，並繼續解析文件。遇到script外部js，並且沒有設定async d...