當瀏覽器獲得乙個html檔案時，會「自上而下」載入，並在載入過程中進行解析渲染
解析：
reflow要比repaint更花費時間，也就更影響效能。要盡量避免過多的reflow。3.1 什麼是同步載入
載入到js檔案時會等待js檔案載入完成且執行完成 再繼續執行後面的**（html css js）
同步載入，又稱阻塞模式，會阻止瀏覽器的後續處理，停止了後續的解析，因此停止了後續的檔案載入（如影象）、渲染、**執行。3.2 什麼是非同步載入
非同步載入就是在執行過程同時載入，通常會使之類重要性較次的東西，可以先忽略掉，比如遊戲論壇**製作中，網頁遊戲經常會在玩的過程中，玩家都是黑影（未載入圖形，由其他黑影模型代替），如果另乙個執行緒完成載入了，在貼上去，就是非同步
1、建立document物件，開始解析web頁面。解析html元素和他們的文字內容後新增element物件和text節點到文件中，這個階段document.readystate = 『loading』.
2、遇到link外部css，建立執行緒載入，並繼續解析文件。
3、遇到script外部js，並且沒有設定async、defer，瀏覽器載入，並阻塞，
等待js載入完成並執行該指令碼，然後繼續解析文件。
-解析的同步js檔案-
4、遇到script外部js，並且設定有async、defer，瀏覽器建立執行緒載入，並繼續解析文件。對於async屬性的指令碼，指令碼載入完成後立即執行。
chrome瀏覽器禁止了外部非同步的js檔案使用document.write()方法
5、遇到img等，先正常解析dom結果，然後瀏覽器非同步載入src（資源），並繼續解析文件。
6、當文件解析完成，document.readystate = 『interactive』.
7、文件解析完成後，所有設定有defer的指令碼按照順序執行。
8、document物件觸發domcontentloaded事件，這也標誌著程式執行從同步指令碼執行階段，轉換為事件驅動階段。
-事件驅動階段:瀏覽器正常發揮功能-
9、當所有async的指令碼的載入完成並執行後、img等載入完成後，`document.readystate = 『complete』,window`物件觸發load事件頁面所有的內容解析完成 載入完成
10、從此，以非同步響應式處理使用者輸入、網路事件等。
頁面渲染 非同步載入JS 時間線
目錄 一 頁面渲染 二 非同步載入js 三 時間線 瀏覽器載入頁面時優先識別html 生成dom節點樹 domtree dom節點樹生成完畢後，再生成與dom樹類似的css樹 csstree css樹上的節點與dom節點對應。dom樹和css樹都遵循深度優先原則。生成dom節點樹的過程叫頁面解析。頁...
js載入時間線
建立document物件，開始解析web頁面。解析html元素和他們的文字內容後新增element物件和text節點到文件中。這個階段 document.readystate loading 遇到link外部css，建立執行緒載入，並繼續解析文件。遇到script外部js，並且沒有設定async d...
JS載入時間線
js載入時間線，依據js出生的那一刻起，記錄了一系列瀏覽器按照順序做的事 就是乙個執行順序 js時間線步驟 建立document物件 文件解析完 文件解析完載入完執行完 1 建立document物件，開始解析web頁面，解析html元素和他們的文字內容後新增element物件和text節點到文件中，...