1、DNS將域名解析ip地址
輸入網址以後,瀏覽器會先去緩存中查找這個域名有沒有對應的ip地址的關係,如果有的話,直接向ip地址發送請求,進行下一步。如果沒有,再去找DNS服務器解析域名
2、建立TCP連接
拿到相應的ip地址以後,向該服務器發送請求。TCP三次握手就是一個問詢的過程。客戶端問詢是否可以發送-服務器確認可以發送-客戶端知道了可以發送。
例:
客戶端:我可以做你男朋友嗎?
服務器:可以哦
客戶端:好的(在一起了牽手手了巴拉巴拉...)
3、發送HTTP請求
建立連接後,可以發送請求了。-http請求一般包含四個部分-請求頭、空行、請求內容、請求行。
請求方法:post/delete/put/patch/get/head/trace/option
4、服務器處理請求
web服務器收到請求後知道了需要調度哪些資源來解析http請求的參數和信息,然後將請求的結果返回給客戶端。
5、返回相應的結果
就是http的響應信息。http響應信息的結構分爲狀態碼,響應內容。
狀態碼一般分爲以下幾種類型:
2-成功 200
3-重定向 304
4-客戶端問題 404
5-服務器端問題 500
6、關閉TCP連接
四次揮手,問詢關閉的過程。
例:
客戶端:我想分手。
服務器端:我思考下我分不分...分吧
客戶端:那我們分手吧。
服務器端:好的,滾犢子吧。
7、瀏覽器解析html+css+js+以及一些媒體資源
解析生成html的dom樹,解析css生成cssom規則樹,然後合成-生成渲染樹
8、佈局
遍歷渲染樹生成佈局,計算每個節點的大小和位置信息。繪製,顯示。
7和8瀏覽器解析過程:
解析html-生成dom樹
解析css-生成規則樹
合成-生成渲染樹
遍歷渲染樹開始佈局-計算每個節點的大小和位置
繪製-顯示
需要注意的是:
html渲染規則-先解析css,後js,js和css的解析都會阻礙dom的解析,
渲染樹的生成是左右形勢渲染的,先生成dom,然後根據dom查找相應的css進行渲染。
這裏還需要提到兩個詞:重繪和重排。
重繪:部分改變,整體佈局不變。repaint
重排:渲染樹變了,需要重新計算渲染樹。reflow
重繪不一定重排,重排一定重繪