摘要:的速度明顯快于重排重繪與的區(qū)別理解了瀏覽器是如何渲染頁面之后我們再來比較這兩者就很好理解了執(zhí)行的時間必須等到頁面內(nèi)包括圖片的所有元素加載完畢后才能執(zhí)行。
先上圖,我們再慢慢解釋,這圖就是瀏覽器加載網(wǎng)頁的一個過程
當(dāng)我們在瀏覽器輸入一個地址(比如:http://toadw.cn),那么點擊回車后,瀏覽器是如何加載網(wǎng)頁的呢?
加載過程一開始瀏覽器是不知道你輸入的http://toadw.cn這個東西是什么的,也不知道要去哪里給你找這個網(wǎng)頁,他需要向DNS服務(wù)發(fā)出解析請求
大致的步驟如下:
瀏覽器發(fā)送toadw.cn尋址請求給DNS服務(wù)
DNS返回數(shù)據(jù)告訴瀏覽器toadw.cn的服務(wù)器地址是255.255.255.255
本地電腦緩存DNS數(shù)據(jù),并發(fā)送請求給255.255.255.255這個服務(wù)器,然后瀏覽器和服務(wù)器根據(jù)HTTP協(xié)議進(jìn)行通訊
網(wǎng)頁渲染瀏覽器拿到HTML代碼之后,它是如何顯示給大家看的呢?其實所謂的渲染就是講HTML代碼根據(jù)CSS定義的規(guī)則顯示在瀏覽器窗口中的這個過程
首先瀏覽器先把這個HTML文檔先轉(zhuǎn)化為DOM樹,然后根據(jù)這個DOM樹,進(jìn)行渲染,轉(zhuǎn)化為可視的東西
在渲染的時候,瀏覽器從上到下依次渲染DOM樹,當(dāng)發(fā)現(xiàn)有外鏈資源或腳本、、