js載入時間線，依據js出生的那一刻起，記錄了一系列瀏覽器按照順序做的事（就是乙個執行順序）。
js時間線步驟（建立document物件 ==> 文件解析完 ==> 文件解析完載入完執行完）
1、建立document物件，開始解析web頁面，解析html元素和他們的文字內容後新增element物件和text節點到文件中，這個階段document.readystate = 『loading』。
2、遇到link外部css，建立執行緒，進行非同步載入，並繼續解析文件。
3、遇到script外部js，並且沒有async，defer，瀏覽器同步載入，並阻塞，等待js載入完成並執行該指令碼，然後繼續解析文件。
4、遇到外部js，並且設有async，defer，瀏覽器建立執行緒非同步載入，並繼續解析文件。
對於async屬性的指令碼，指令碼載入完成後立即執行。（非同步禁止使用document.wriite()，因為當你整個文件解析到差不多，再呼叫document.write()，會把之前所有的文件流都清空，用它裡面的文件代替）
5、遇到img等（帶有src）,先正常解析dom機構，然後瀏覽器非同步載入src，並繼續解析文件。看到標籤直接產生dom樹，不用等img載入完src。
6、當文件解析完成（domtree建立完畢，不是載入完畢），document.readystate = 『interactive』。
7、文件解析完成後，所有設定有defer的指令碼會按照順序執行。（注意與async的不同，但同樣禁止使用document.write()）。
8、document物件觸發domcontentloaded事件，這也標誌著程式執行從同步指令碼執行階段，轉化為事件驅動階段。
9、當所有async的指令碼載入完成並執行後，img等載入完成後（頁面所有的都執行載入完之後），document.readystate = 『complete』，window物件觸發load事件。
10、從此，以非同步響應方式處理使用者輸入、網路事件等。
js載入時間線
建立document物件，開始解析web頁面。解析html元素和他們的文字內容後新增element物件和text節點到文件中。這個階段 document.readystate loading 遇到link外部css，建立執行緒載入，並繼續解析文件。遇到script外部js，並且沒有設定async d...
js 同步載入，非同步載入和載入時間線
常預設的是同步載入 同步模式又稱阻塞模式，會阻止瀏覽器的後續操作，相當於阻止了後續的檔案的解析，執行等。載入到js檔案會等候js檔案載入完成，html css載入線被阻斷 瀏覽器之所以會採用同步模式，是因為載入的js檔案中有對dom的操作 重定向，輸出document等預設行為，所以同步才是最好的。...
頁面渲染 非同步載入JS 時間線
目錄 一 頁面渲染 二 非同步載入js 三 時間線 瀏覽器載入頁面時優先識別html 生成dom節點樹 domtree dom節點樹生成完畢後，再生成與dom樹類似的css樹 csstree css樹上的節點與dom節點對應。dom樹和css樹都遵循深度優先原則。生成dom節點樹的過程叫頁面解析。頁...