版權聲明：本文為博主原創文章，轉載請注明出處【by: MyNameIsAngela】
說明：此處主要強調網絡連接過程、渲染過程
一、初始準備（服務器端）
1.服務器啟動監聽服務,準備迎接來自客戶機的請求。服務器啟動操作系統—啟動http服務進程（apache or nginx or ..）--服務進程開始定位到服務器上的www文件夾，一般是位于/var/www。
2.服務器啟動一些附屬的模塊。例如php，或者，使用fastcgi方式連接到php的fpm管理進程。
3.向操作系統申請一個tcp連接
4.綁定在80端口
5.調用了accept函數
6.開始監聽。監聽著可能來自位于地球任何一個地方的請求，隨時準備做出響應
補充：典型的情況下，機房里面應該還有一個數據庫服務器，或許，還有一臺緩存服務器，如果對于流量巨大的網站，那么動態腳本的解釋器可能還有單獨的物理機器來跑，如果是中小的站點，那么，上述的各色服務，甚至都可能在一臺物理機上，不管怎么說，他們做好了準備，靜候差遣。
二、查找服務器IP
1.輸入地址URL（Uniform Resource Identifier統一資源標識符）。鍵盤上的每個按鍵都有不同的電頻，通過按鍵，電腦得知輸入的內容。在瀏覽器中輸入網址的時候，瀏覽器其實就已經在智能的匹配可能得url了，他會從歷史記錄，書簽等地方，找到已經輸入的字符串可能對應的url，然后給出智能提示。
2.把URL分割成幾個部分：協議、網絡地址、資源路徑。例如：http://www.guokr.com/question/554991/中<協議:http>從該計算機獲取資源的方式，常見的是HTTP、HTTPS、FTP、FILE，不同協議有不同的通訊內容格式；<網絡地址: www.guokr.com>指示該連接網絡上哪一臺計算機，可以是域名或者IP地址，可以包括端口號。通常端口號不常見是因為大部分的都是使用默認端口，如HTTP默認端口80，HTTPS默認端口443。更多詳細內容請參考：同源策略和跨域問題；<資源路徑: /question/554991/>指示從服務器上獲取哪一項資源。我們最常見的的協議是HTTP協議，除此之外還有加密的HTTPS協議、FTP協議、FILe協議等等。
3.DNS解析域名（根據域名找ip）
根據瀏覽器緩存->操作系統緩存（host）->路由器緩存->DNS服務器…..->全世界的頂級DNS上，逐級遞歸向上找,找到該域名對應的IP地址。DNS同時占用UDP和TCP的53端口。客戶端進行DNS查詢時，一般使用UDP協議，而域名服務器之間進行區域傳輸，例如數據同步時則使用TCP協議。（此處可根據傳輸數據量來理解，其中UDP報文的最大長度為512字節，而TCP則允許報文長度超過512字節。）
瀏覽器緩存：瀏覽器會記錄DNS一段時間，因此，只是第一個地方解析DNS請求；
操作系統緩存：如果在瀏覽器緩存中不包含這個記錄，則會使系統調用操作系統，獲取操作系統的記錄(保存最近的DNS查詢緩存)；
路由器緩存：如果上述兩個步驟均不能成功獲取DNS記錄，繼續搜索路由器緩存；
ISP緩存：若上述均失敗，繼續向ISP搜索。ISP(Internet Service Provider)，互聯網服務提供商，即電信運營商。
補充：
A.IP地址對應著網絡上一臺計算機，DNS服務器本身也有IP，你的網絡設置包含DNS服務器的IP。
B.如果有病毒把一些常用的域名，修改hosts文件，指向一些惡意的IP，那么瀏覽器也會不加判斷的去連接。
C.在不同的地區或者不同的網絡（電信、聯通、移動）的情況下，轉換后的IP地址很可能是不一樣的，這首先涉及到負載均衡的第一步。即，通過DNS解析域名時將你的訪問分配到不同的入口，同時盡可能保證你所訪問的入口是所有入口中可能較快的一個。
三、客戶端和服務器進行連接
1.向確定的IP和端口號，構造一個http請求
確定端口號。端口號之于計算機就像窗口號之于銀行，一家銀行有多個窗口，每個窗口都有個號碼，不同窗口可以負責不同的服務。端口只是一個邏輯概念，和計算機硬件沒有關系。例如：www.guokr.com不包含端口號，http協議默認端口號是80。如果你輸入的url是http://www.guokr.com:8080/，那表示不使用默認的端口號，而使用指定的端口號8080。
發起請求方法。一個典型的http request header一般需要包括請求的方法，例如GET或者POST等，不常用的還有PUT和DELETE方法，更加不常用的還有HEAD和OPTION以及TRACE方法，一般的瀏覽器只能發起GET或者POST請求，
2.瀏覽器發起一條tcp連接(傳輸層)
開始三次握手的過程，tcp包被封裝到網絡層的ip包里面，ip包再被封裝到數據鏈路層的數據幀結構中，再通過物理層的比特流送出去。這些分層的意義在于分工合作，數據鏈路層通過CSMA/CD協議保證了相鄰兩臺主機之間的數據報文傳遞，而網絡層的ip數據包通過不同子網之間的路由器的路由算法和路由轉發，保證了互聯網上兩臺遙遠主機之間的點對點的通訊，不過這種傳輸是不可靠，于是可靠性就由傳輸層的tcp協議來保證。tcp通過慢開始，乘法減小等手段來進行流量控制和擁塞避免，同時提供了兩臺遙遠主機上進程到進程的通信，最終保證了http的請求頭能夠被遠方的服務器上正在監聽的http服務器進程收到。終于，數據包在跳與跳之間被拆了又封裝，在子網與子網之間被轉發了又轉發，最后進入了服務器的操作系統的緩沖區。服務器的操作系統由此給正在被阻塞住的accept函數一個返回，將他喚醒。
3.握手成功后，瀏覽器向服務器發送http請求，請求數據包。
如果資源路徑指示的資源不存在，服務器就會返回著名的404錯誤。
4.服務器接受并處理HTTP報文
請求進入服務器之后，服務器上的的http監聽進程會得到這個請求，然后一般情況下會啟動一個新的子進程去處理這個請求，同時父進程繼續監聽。
http服務器首先會查看重寫規則，然后如果是文件真實存在，例如一些圖片，或者css js等的靜態文件，就會直接把這個文件返回，如果是一個動態的請求，那么會根據url重寫模塊的規則，把這個請求重寫到一個rest風格的url上，然后根據動態語言的腳本，來決定調用什么類型的動態文件腳本解釋器來處理這個請求。
5.服務器構造并發送響應報文（傳輸過程略）
在視圖層把頁面準備好后，再從動態腳本解釋器送回到http服務器，由http服務器把這些正文加上一個響應頭，封裝成一個標準的http響應包，再通過TCP／IP協議，送回到客戶機瀏覽器。
前端開發人員會將并發加載的資源文件分布在好多個域名下，變相的繞過瀏覽器的限制。即，瀏覽器在同一個域名下并發加載的資源數量是有限制的，例如ie6-7是兩個，ie8是6個，chrome各版本不大一樣，一般是4-6個。
四、渲染
當瀏覽器接收到報文，根據收到的資源的類型，將資源組織成屏幕上顯示的圖像，這個過程叫渲染。網頁渲染是瀏覽器最復雜、最核心的功能。
1.瀏覽器判斷狀態碼。
當請求的響應到達客戶端的瀏覽器后，響應到達瀏覽器之后，瀏覽器首先判斷狀態碼。
1xx：指示信息–表示請求已接收，繼續處理。
2xx：成功–表示請求已被成功接收、理解、接受，直接進入渲染流程。。
3xx：重定向–要完成請求必須進行更進一步的操作。即要去相應頭里面找location域，根據這個location的指引，進行跳轉，這里跳轉需要開啟一個跳轉計數器，是為了避免兩個或者多個頁面之間形成的循環的跳轉，當跳轉次數過多之后，瀏覽器會報錯，同時停止。
4xx：客戶端錯誤–請求有語法錯誤或請求無法實現。
5xx：服務器端錯誤–服務器未能實現合法的請求。
2.當得到一個正確的200響應之后，進行語言的編碼解析。
響應頭是一個ascii的標準字符集的文本，這個還好辦，但是響應的正文本質上就是一個字節流，對于這一坨字節流，瀏覽器要怎么去處理呢，首先瀏覽器會去看響應頭里面指定的encoding域，如果有了這個東西，那么就按照指定的encoding去解析字符，如果沒有的話，那么瀏覽器會使用一些比較智能的方式，去猜測和判斷這一坨字節流應該使用什么字符集去解碼。相關的筆記可以看這里，瀏覽器對編碼的確定
3.解析html構建dom樹
此時DOM樹只是一個樹形結構，沒規定每個DOM節點的樣式。在html語言嵌套正常而且規范的情況下，這種xml標記的語言是比較容易的能夠構建出一棵dom樹出來的，當然，對于互聯網上大量的不規范的頁面，不同的瀏覽器應該有自己不同的容錯去處理。構建出來的dom本質上還是一棵抽象的邏輯樹，
構建dom樹的過程中，如果遇到了由script標簽包起來的js動態腳本代碼，那么會把代碼送到js引擎里面去跑，如果遇到了style標簽包圍起來的css代碼，也會保存下來，用于稍后的渲染。如果遇到了img等引用外部文件的標簽，那么瀏覽器會根據指定的url再次發起一個新的http請求，去把這個文件拉取回來，值得一提的是，對于同一個域名下的下載過程來說，瀏覽器一般允許的并發請求是有限的，通常控制在兩個左右，所以如果有很多的圖片的話，一般出于優化的目的，都會把這些圖片使用一臺靜態文件的服務器來保存起來，負責響應，從而減少主服務器的壓力。
4.根據CSS生成CSSOM
5.構造render樹
將DOM和CSSOM整合形成RenderTree（渲染樹）。結構和DOM樹一樣，是樹形結構，但每個節點中的樣式（位置、長、寬、高、顏色、背景圖片布局等）被標識出來。render樹一旦構建完成，整個頁面也就準備好了。
6.布局render樹
7.繪制render樹。注意，當遇到<script>時，會執行并阻塞渲染，因為js有權利改變dom結構時，會執行并阻塞渲染。
補充說明
下載頁面，構建dom樹，構建render樹這三個步驟，實際上并不是嚴格的先后順序的，為了加快速度，提高效率，讓用戶不要等那么久，現在一般都并行的往前推進的，現代的瀏覽器都是一邊下載，下載到了一點數據就開始構建dom樹，也一邊開始構建render樹，構建了一點就顯示一點出來，這樣用戶看起來就不用等待那么久了。
推薦理由：自學前端一系列技術，并參考視頻實踐前端項目：Vue高仿餓了么頁面、愛心魚HTML5小游戲。研究生期間研究背景為計算機圖形學。
本科期間獲得“藍橋杯”全國軟件專業人才設計與創業大賽-江西賽區-三等獎、以及連續兩年三等獎獎學金（校級）
直接、正義、輕微強迫癥、超愛公平的天秤座；
認真負責，即使不想做的事，只要做了也會用負責到底的態度完成；
為人樂觀向上，能夠良好的與人溝通交流，并有集體榮譽感。
