前端性能優化成神之路—瀏覽器的一個請求從發送到返回都經歷了什麼

瀏覽器的一個請求從發送到返回都經歷了什麼

下面是一個請求的一個流程圖

用戶首先在瀏覽器輸入請求的url地址，瀏覽器內部的核心代碼會將這個url進行拆分解析，最終將domain發送到DNS服務器上，DNS服務器會根據domain去查詢相關對於的ip地址，從而將IP地址返回給瀏覽器，瀏覽器持有ip地址後就會知道這個請求是要發送到哪一個地方（哪一個服務器上），而後跟隨協議，將ip地址打在協議中，而且請求的相關的參數都會在協議中攜帶，最終發送到網絡中去

而後通過咱們本身的局域網——交換機——路由器——主幹網絡——最終到達服務端

服務端是有個MVC架構的請求會首先進入到Controller中進行相關的邏輯處理和請求的分發——調用Model層（負責和數據進行交互）數據交互的過程當中Model會去讀取redis和數據庫裏面的數據——獲取到數據以後叫渲染好的頁面經過View層返回給網絡

這時候一個HTTP請求的Response又從服務端返回到瀏覽器，瀏覽器作一個render的過程（就是根據請求回來的html以及這個html所關聯的css，js去進行渲染的過程，那麼渲染的過程當中瀏覽器會根據html去造成相關的dom樹以及對應的css樹，而後對dom樹和css樹進行整合，最終知道某個dom節點知道須要什麼樣的樣式，從而進行樣式的渲染）樣式渲染完成以後，瀏覽器會進一步去執行下面的js腳本，執行動態的頁面的能力，從而最終的頁面就在瀏覽器中展示出來了

 

 

 

前端頁面渲染流程

詳情查看：前端性能優化成神之路—前端頁面渲染流程

 

 

 

從瀏覽器的一個請求從發送到返回都經歷過程當中的優化點有哪些呢

dns服務器中進行優化，就是在瀏覽器層面，設置路由層面將dns服務器中相關的資源進行緩存，這樣訪問dns的時間就會縮短不少

網絡請求的過程當中的優化涉及到帶寬，網絡的選擇，緩存等，在不少公司在網絡請求的時候都會使用cdn，cdn就解決了網絡選擇以及緩存的問題，可是訪問cdn的過程當中會涉及到一個問題，就是cdn是請求靜態資源用的，靜態資源來講實際上 咱們請求中攜帶的cookie是沒有用的，因此在請求靜態資源的過程當中，將cookie從httprequest的header中去掉，可是不少時候，咱們cdn的域名會跟網站的域名相同，那麼就會將咱們主站的cookie經過咱們的網絡去攜帶到cdn的服務端，這個是對網絡無畏的損耗，因此cdn的域名不要跟主站的域名同樣，這樣就能夠防止訪問cdn的時候攜帶cookie的問題，可是對於接口咱們是沒辦法使用cdn的

1.dns經過緩存減小dns查詢時間

2.網絡請求的過程當中走最近的網絡環境

3.相同的靜態資源使用緩存

4.減小http請求的大小

5.減小http請求的數量

6.服務端渲染