中文字幕日韩精品一区二区免费_精品一区二区三区国产精品无卡在_国精品无码专区一区二区三区_国产αv三级中文在线

瀏覽器從輸入URL到渲染完頁面的整個過程是怎么樣的?

2022-05-29    分類: 網站建設


 瀏覽器的主要功能是將用戶選擇的web資源呈現(xiàn)出來,它從服務器請求資源,并將得到的資源(HTML,PDF,image等等)顯示在瀏覽器窗口。那么從用戶敲入URL到完整渲染出來,經歷了什么過程呢?也就是說整個瀏覽器的工作流程是怎樣的呢?

整個過程大致如下:


       1. 輸入URL,瀏覽器根據域名尋找IP地址
 2. 瀏覽器發(fā)送一個HTTP請求給服務器,如果服務器返回以301之類的重定向,瀏覽器根據相應頭中的location再次發(fā)送請求
 3. 服務器接受請求,處理請求生成html代碼,返回給瀏覽器,這時的html頁面代碼可能是經過壓縮的
 4. 瀏覽器接收服務器響應結果,如果有壓縮則首先進行解壓處理
 5. 瀏覽器開始顯示HTML

     6. 瀏覽器發(fā)送請求,以獲取嵌入在HTML中的對象。在瀏覽器顯示HTML時,它會注意到需要獲取其他地址內容的標簽。


這時,瀏覽器會發(fā)送一個獲取請求來重新獲得這些文件——包括CSS/JS/圖片等資源,這些資源的地址都要經歷一個和HTML讀取類似的過程。所以瀏覽器會在DNS中查找這些域名,發(fā)送請求,重定向等等…

 那么,一個頁面,究竟是如何從我們輸入一個網址到最后完整的呈現(xiàn)在我們面前的呢?還需要了解一下瀏覽器是如何渲染的。
首先是用戶輸入url,瀏覽器通過DNS查詢要訪問頁面的IP,查詢到后,瀏覽器會替用戶去向這個IP地址發(fā)送請求拉取html文件,瀏覽器會派GUI線程去解析加載回來的html文件

html解析過程:01機器碼-》charter字符-》tokens令牌-》node節(jié)點-》dom樹


解析CSS,構建CSSOM
有了骨骼以后,接下來就是確定長相了,這是CSS要做的事情。和解析HTML類似,CSS解析各種樣式信息,生成網頁的“外觀”。但是有個問題,CSSA(class選擇器)說,我喜歡藍色,我家網頁的所有文字都要是藍色。CSSB(id選擇器)就不樂意了,憑啥啊,我喜歡紅色,我家的標題必須是紅色。由于id選擇器是親生的,那就標題是紅色的吧,于是不同選擇器就有了不同的權重。最后生成CSSOM

因為瀏覽器解析文檔,如果遇到請求外部資源時,如圖像,iconfont,JS等。瀏覽器將下載該資源。請求過程是異步的,并不會影響HTML文檔進行加載,當遇到

    <rt id="gasiw"></rt>
    <button id="gasiw"><bdo id="gasiw"></bdo></button>
    <code id="gasiw"><tr id="gasiw"></tr></code>
  • 二手房| 龙里县| 耿马| 澳门| 疏勒县| 舞阳县| 北京市| 兴和县| 聂拉木县| 承德县| 涿鹿县| 红原县| 镇原县| 南岸区| 边坝县| 宿松县| 玉山县| 南召县| 江口县| 垣曲县| 清镇市| 遵义县| 乐业县| 盐山县| 汝城县| 雷州市| 顺义区| 郁南县| 甘泉县| 乌兰察布市| 津市市| 望江县| 淮滨县| 大化| 磴口县| 靖江市| 谢通门县| 玉林市| 信丰县| 宜宾市| 桃园市|