[01]url請求到渲染

1. http狀態碼有哪些？分別表示什麼意思？
   狀態碼告知從服務器返回的請求結果。
   2XX代表請求被正常處理了。200OK、204No Content（服務器接收的請求已經處理成功，但在返回的響應報文中不包含實體的主體部分）、206Partial Content(客戶端進行了範圍請求，對資源的某一部分請求)；3XX重定向，301moved permanently(資源已分配新的uri)、302 found(本次使用新uri訪問)、303 see other(以get定向到另外一個uri)、304 not modified、307 temporary redirect(不會從post改成get)；4XX客戶端錯誤，400 bad request（請求報文中存在語法錯誤），402 unauthorized（發送的請求須要經過http認證）、403 forbidden（服務器拒絕了對資源的訪問）、404 not found（服務器上沒有請求的資源）；500XX服務器錯誤 500internal server error（服務器在執行是發生了錯誤）、503 service unavailable（服務器正忙或停機維護）。

2. 一個頁面從輸入 URL 到頁面加載完的過程當中都發生了什麼事情？
   總的來講，根據web瀏覽器地址欄中指定的URL，web瀏覽器從web服務器端獲取資源文件等信息，從而顯示出web頁面。具體而言，有以下幾個步驟：

   • 1.瀏覽器接收URL(包含的信息：協議方案名、服務器地址:服務器端口號、帶層次的文件路徑、查詢字符串？、片斷標識符)
     
   • 2.將URL與緩存進行比對若是請求的頁面在緩存中且未過時，則直接進行第8步。
     
   • 3.負責域名解析DNS服務。系統進行DNS查找，並將IP地址返回給瀏覽器。
     DNS服務適合HTTP協議同樣位於應用層的協議。它提供域名到IP地址之間的解析服務。能夠經過域名查找IP地址，也能夠逆向從IP地址反查找域名。
   • 4.瀏覽器與服務器創建TCP鏈接（在傳輸層）
     這一步很複雜由於用到了HTTPS。三次握手(SYN,SYN/ACK,ACK)，如有一次任何一方收不到信息那麼將會從新發起 TCP 鏈接。
   • 5.瀏覽器向服務器經過TCP協議鏈接發送HTTP請求。
     數據通過應用層、傳輸層、網絡層、鏈路層，傳輸到下一個目的地。應用層決定了向用戶提供應用服務時的通訊（http協議，DNS服務）。傳輸層對上層應用層，提供處於網絡鏈接中的兩臺計算機之間的數據傳輸（TCP協議和UDP協議）。網絡層用來處理網絡上流動的數據包，數據包是網絡傳輸的最小數據單位，該層規定經過怎樣的路徑到達對方計算機，並把數據傳輸給對方。鏈路層處理鏈接網絡的硬件部分（網卡，光纖）。這一步驟還會涉及發送給服務器的請求報文（請求方法、請求URI、協議版本、首部字段、內容實體）。
   • 6.服務器收到請求，從它的文檔空間中查找資源並返回HTTP響應。
     服務器返回的響應報文包括協議版本、狀態碼、解釋狀態碼的緣由短語、響應首部字段、實體主體。
   • 7.瀏覽器接受 HTTP 響應，檢查 HTTP header 裏的狀態碼，並作出不一樣的處理方式。關於返回的狀態碼的具體說明看上個問題。
   • 8.若是是能夠緩存的，這個響應則會被存儲起來。
     根據首部字段判斷是否進行緩存。例如，Cache-Control, no-cache(每次使用緩存前和服務器確認)，no-store 絕對禁止緩存。
   • 9.瀏覽器解碼響應
     瀏覽器拿到index.html文件後，就開始解析其中的html代碼，遇js/css/image等靜態資源時，就向服務器端去請求下載；解析成對應的樹形數據結構DOM樹、CSS規則樹，Javascript腳本經過DOM API和CSSOM API來操做DOM樹、CSS規則樹。
   • 10.渲染頁面
   • 11.關閉TCP鏈接或繼續保持鏈接
     經過四次揮手關閉鏈接(FIN ACK, ACK, FIN ACK, ACK)。
3. 頁面渲染的過程頁面渲染過程總的來講是，瀏覽器拿到html文檔，自上而下構建dom樹，再根據dom樹構建渲染樹（和dom樹有區別，瀏覽器解析html文檔和解析css樣式造成dom樹和cssdom樹，結合這兩種纔會構建渲染樹）。這裏有一種狀況，若是在head中寫入link某個css文件，然後插入script標籤，引入一個巨大的js文件，因爲瀏覽器下載css文件需耗時間，這個時候瀏覽器還在自上而下地去解析dom樹，可是遇到script標籤，而且因爲樣式表沒有下載下來，阻塞了構建渲染樹。一旦css文件加載完成，會結合剛在的dom樹構建渲染樹，顯示到頁面，接續加載js文件。可是恰巧js文件巨大，阻塞了瀏覽器向下解析，等待這個巨大的js文件下載完成後才繼續向下解析。如此反覆， 最後將渲染樹渲染到頁面。