html，css，js載入順序

1. 載入方式

css 非同步載入（不阻塞）

js 同步載入（阻塞）

2. 放置順序

css 放置於標籤中原因：要是頁面在無css渲染下先載入html的話將會面目全非，樣式先行的話在載入html內容時可以同時渲染樣式 js 放置於標籤之前、body標籤中html內容的後面

原因：為了提高頁面渲染的速度效率。瀏覽器在載入

沒有 defer 或 async，瀏覽器會立即載入並執行指定的指令碼，「立即」指的是在渲染該 script 標籤之下的文件元素之前，也就是說不等待後續載入的文件元素，讀到就載入並執行

有 async，載入和渲染後續文件元素的過程將和 script.js 的載入與執行並行進行（非同步）。

有 defer，載入後續文件元素的過程將和 script.js 的載入並行進行（非同步），但是 script.js 的執行要在所有元素解析完成之後，domcontentloaded 事件觸發之前完成。

defer 是最接近我們對於應用指令碼載入和執行的要求的，而且它是按照載入順序執行指令碼的，這一點要善加利用；

async 則是乙個亂序執行方式，對它來說指令碼的載入和執行是緊緊挨著的，所以不管你宣告的順序如何，只要它載入完了就會立刻執行，async 對於應用指令碼的用處不大，因為它完全不考慮依賴（哪怕是最低階的順序執行），不過它對於那些可以不依賴任何指令碼或不被任何指令碼依賴的指令碼來說卻是非常合適的。

4. 網頁的渲染機制

解析 html 標籤, 構建 dom 樹解析 css 標籤, 構建 cssom 樹把 dom 和 cssom 組合成渲染樹 (render tree) 在渲染樹的基礎上進行布局, 計算每個節點的幾何結構

把每個節點繪製到螢幕上 (painting)