自上而下解析，遇到任何樣式（link、style）和指令碼（script）都會阻塞
1）css載入不會阻塞html檔案的解析，但會阻塞dom的渲染
2）css載入會阻塞後面js語句的執行
3）js會阻塞html的解析和渲染
4）沒有defer和async標籤的script會立即載入並執行
5）有async標籤的js，js的載入執行和html的解析和渲染並行
6）有defer標籤的js，js的載入和html的解析和渲染並行，但會在html解析完成後執行,在觸發domcontentloaded事件前執行
7）domcontentloaded和onload的區別：domcontentloaded在html解析完畢後執行，loload在頁面完全載入完成後執行（包括樣式和）
1）重繪：根據元素的新屬性重新繪製，使元素呈現新的外觀
2）重排：當渲染樹中的一部分因為元素的規模尺寸，布局，隱藏等改變而需要重新構建
3）重排必定會引發重繪，但重繪不一定會引發重排
頁面渲染流程
1.瀏覽器把獲取到的html 解析成1個dom樹，html中的每個tag都是dom樹中的1個節點，根節點就是我們常用的document物件。dom樹里包含了所有html標籤，包括display none隱藏，還有用js動態新增的元素等。2.瀏覽器把所有樣式 使用者定義的css和使用者 解析成樣式結構...
頁面渲染的原理及流程
根據html檔案構建dom樹和cssom樹。構建dom樹期間，如果遇到js，阻塞dom樹及cssom樹的構建，優先載入js檔案，載入完畢，再繼續構建dom樹及cssom樹。構建渲染樹。頁面的重繪與重排 也有稱回流 頁面渲染完成後，若js操作了dom節點，根據js對dom操作動作的大小，瀏覽器對頁面進...
瀏覽器頁面渲染流程
渲染流水線中css和js的載入 相關概念 html css js資料通過渲染模組的處理最終輸出為螢幕上的畫素 渲染模組被劃分為很多子階段，輸入的資料通過這些子階段最後輸出畫素，這樣的乙個處理流程叫做渲染流水線 注意 每個子階段都有其輸入內容 處理過程和輸出內容 因為瀏覽器無法直接理解和使用html，...