（非原創，）
1. DNS解析
DNS解析的過程就是尋找哪臺機器上有你需要資源的過程。當你在瀏覽器中輸入一個地址時，例如www.baidu.com，其實不是百度網站真正意義上的地址。互聯網上每一臺計算機的唯一標識是它的IP地址，但是IP地址并不方便記憶。用戶更喜歡用方便記憶的網址去尋找互聯網上的其它計算機，也就是上面提到的百度的網址。所以互聯網設計者需要在用戶的方便性與可用性方面做一個權衡，這個權衡就是一個網址到IP地址的轉換，這個過程就是DNS解析。它實際上充當了一個翻譯的角色，實現了網址到IP地址的轉換.
2. 瀏覽器向 web 服務器發送一個 HTTP 請求
拿到域名對應的IP地址之后，瀏覽器會以一個隨機端口（1024<端口<65535）向服務器的WEB程序（常用的有httpd,nginx等）80端口發起TCP的連接請求。這個連接請求到達服務器端后（這中間通過各種路由設備，局域網內除外），進入到網卡，然后是進入到內核的TCP/IP協議棧（用于識別該連接請求，解封包，一層一層的剝開），還有可能要經過Netfilter防火墻（屬于內核的模塊）的過濾，最終到達WEB程序，最終建立了TCP/IP的連接。
3. 服務器的永久重定向響應
服務器給瀏覽器響應一個301永久重定向響應，這樣瀏覽器就會訪問“http://www.google.com/” 而非“http://google.com/”。為什么服務器一定要重定向而不是直接發送用戶想看的網頁內容呢？其中一個原因跟搜索引擎排名有關。如果一個頁面有兩個地址，就像http://www.yy.com/和http://yy.com/，搜索引擎會認為它們是兩個網站，結果造成每個搜索鏈接都減少從而降低排名。而搜索引擎知道301永久重定向是什么意思，這樣就會把訪問帶www的和不帶www的地址歸到同一個網站排名下。還有就是用不同的地址會造成緩存友好性變差，當一個頁面有好幾個名字時，它可能會在緩存里出現好幾次。
4. 瀏覽器跟蹤重定向地址
現在瀏覽器知道了 "http://www.google.com/"才是要訪問的正確地址，所以它會發送另一個http請求。這里沒有啥好說的
5. 服務器處理請求
經過前面的重重步驟，我們終于將我們的http請求發送到了服務器這里，其實前面的重定向已經是到達服務器了，那么，服務器是如何處理我們的請求的呢？
后端從在固定的端口接收到TCP報文開始，它會對TCP連接進行處理，對HTTP協議進行解析，并按照報文格式進一步封裝成HTTP Request對象，供上層使用。
一些大一點的網站會將你的請求到反向代理服務器中，因為當網站訪問量非常大，網站越來越慢，一臺服務器已經不夠用了。于是將同一個應用部署在多臺服務器上，將大量用戶的請求分配給多臺機器處理。此時，客戶端不是直接通過HTTP協議訪問某網站應用服務器，而是先請求到Nginx，Nginx再請求應用服務器，然后將結果返回給客戶端，這里Nginx的作用是反向代理服務器。同時也帶來了一個好處，其中一臺服務器萬一掛了，只要還有其他服務器正常運行，就不會影響用戶使用。通過Nginx的反向代理，我們到達了web服務器，服務端腳本處理我們的請求，訪問我們的數據庫，獲取需要獲取的內容等等，當然，這個過程涉及很多后端腳本的復雜操作。由于對這一塊不熟，所以這一塊只能介紹這么多了。
6. 服務器返回一個 HTTP 響應
經過前面的6個步驟，服務器收到了我們的請求，也處理我們的請求，到這一步，它會把它的處理結果返回，也就是返回一個HTPP響應。
HTTP響應與HTTP請求相似，HTTP響應也由3個部分構成，分別是：
l 狀態行
l 響應頭(Response Header)
l 響應正文
HTTP/1.1200OKDate: Sat,31Dec200523:59:59GMT Content-Type: text/html;charset=ISO-8859-1Content-Length:122
＜html＞ ＜head＞ ＜title＞http＜/title＞ ＜/head＞ ＜body＞ ＜!-- body goes here --＞ ＜/body＞ ＜/html＞
狀態行：
狀態行由協議版本、數字形式的狀態代碼、及相應的狀態描述，各元素之間以空格分隔。
格式: HTTP-Version Status-Code Reason-Phrase CRLF
例如: HTTP/1.1 200 OK rn
--協議版本：是用http1.0還是其他版本
--狀態描述：狀態描述給出了關于狀態代碼的簡短的文字描述。比如狀態代碼為200時的描述為 ok
--狀態代碼：狀態代碼由三位數字組成，第一個數字定義了響應的類別，且有五種可能取值。如下
1xx：信息性狀態碼，表示服務器已接收了客戶端請求，客戶端可繼續發送請求。
100 Continue
101 Switching Protocols
2xx：成功狀態碼，表示服務器已成功接收到請求并進行處理。200 OK 表示客戶端請求成功
204 No Content 成功，但不返回任何實體的主體部分
206 Partial Content 成功執行了一個范圍（Range）請求
3xx：重定向狀態碼，表示服務器要求客戶端重定向。
301 Moved Permanently 永久性重定向，響應報文的Location首部應該有該資源的新URL
302 Found 臨時性重定向，響應報文的Location首部給出的URL用來臨時定位資源
303 See Other 請求的資源存在著另一個URI，客戶端應使用GET方法定向獲取請求的資源
304 Not Modified 服務器內容沒有更新，可以直接讀取瀏覽器緩存
307 Temporary Redirect 臨時重定向。與302 Found含義一樣。302禁止POST變換為GET，但實際使用時并不一定，307則更多瀏覽器可能會遵循這一標準，但也依賴于瀏覽器具體實現
4xx：客戶端錯誤狀態碼，表示客戶端的請求有非法內容。
400 Bad Request 表示客戶端請求有語法錯誤，不能被服務器所理解
401 Unauthonzed 表示請求未經授權，該狀態代碼必須與 WWW-Authenticate 報頭域一起使用
403 Forbidden 表示服務器收到請求，但是拒絕提供服務，通常會在響應正文中給出不提供服務的原因
404 Not Found 請求的資源不存在，例如，輸入了錯誤的URL
5xx：服務器錯誤狀態碼，表示服務器未能正常處理客戶端的請求而出現意外錯誤。
500 Internel Server Error 表示服務器發生不可預期的錯誤，導致無法完成客戶端的請求
503 Service Unavailable 表示服務器當前不能夠處理客戶端的請求，在一段時間之后，服務器可能會恢復正常
7. 瀏覽器顯示 HTML
在瀏覽器沒有完整接受全部HTML文檔時，它就已經開始顯示這個頁面了，瀏覽器是如何把頁面呈現在屏幕上的呢？不同瀏覽器可能解析的過程不太一樣，這里我們只介紹webkit的渲染過程，下圖對應的就是WebKit渲染的過程，這個過程包括：
解析html以構建dom樹 -> 構建render樹 -> 布局render樹 -> 繪制render樹
瀏覽器在解析html文件時，會”自上而下“加載，并在加載過程中進行解析渲染。在解析過程中，如果遇到請求外部資源時，如圖片、外鏈的CSS、iconfont等，請求過程是異步的，并不會影響html文檔進行加載。
解析過程中，瀏覽器首先會解析HTML文件構建DOM樹，然后解析CSS文件構建渲染樹，等到渲染樹構建完成后，瀏覽器開始布局渲染樹并將其繪制到屏幕上。這個過程比較復雜，涉及到兩個概念: reflow(回流)和repain(重繪)。
DOM節點中的各個元素都是以盒模型的形式存在，這些都需要瀏覽器去計算其位置和大小等，這個過程稱為relow;當盒模型的位置,大小以及其他屬性，如顏色,字體,等確定下來之后，瀏覽器便開始繪制內容，這個過程稱為repain。
頁面在首次加載時必然會經歷reflow和repain。reflow和repain過程是非常消耗性能的，尤其是在移動設備上，它會破壞用戶體驗，有時會造成頁面卡頓。所以我們應該盡可能少的減少reflow和repain。
當文檔加載過程中遇到js文件，html文檔會掛起渲染（加載解析渲染同步）的線程，不僅要等待文檔中js文件加載完畢，還要等待解析執行完畢，才可以恢復html文檔的渲染線程。因為JS有可能會修改DOM，最為經典的document.write，這意味著，在JS執行完成前，后續所有資源的下載可能是沒有必要的，這是js阻塞后續資源下載的根本原因。所以我明平時的代碼中，js是放在html文檔末尾的。
JS的解析是由瀏覽器中的JS解析引擎完成的，比如谷歌的是V8。JS是單線程運行，也就是說，在同一個時間內只能做一件事，所有的任務都需要排隊，前一個任務結束，后一個任務才能開始。但是又存在某些任務比較耗時，如IO讀寫等，所以需要一種機制可以先執行排在后面的任務，這就是：同步任務(synchronous)和異步任務(asynchronous)。
JS的執行機制就可以看做是一個主線程加上一個任務隊列(task queue)。同步任務就是放在主線程上執行的任務，異步任務是放在任務隊列中的任務。所有的同步任務在主線程上執行，形成一個執行棧;異步任務有了運行結果就會在任務隊列中放置一個事件；腳本運行時先依次運行執行棧，然后會從任務隊列里提取事件，運行任務隊列中的任務，這個過程是不斷重復的，所以又叫做事件循環(Event loop)。
8. 瀏覽器發送請求獲取嵌入在 HTML 中的資源（如圖片、音頻、視頻、CSS、JS等等）
其實這個步驟可以并列在步驟8中，在瀏覽器顯示HTML時，它會注意到需要獲取其他地址內容的標簽。這時，瀏覽器會發送一個獲取請求來重新獲得這些文件。比如我要獲取外圖片，CSS，JS文件等，類似于下面的鏈接：
圖片：
CSS式樣表：http://static.ak.fbcdn.net/rsrc.php/z448Z/hash/2plh8s4n.css
Java 文件：http://static.ak.fbcdn.net/rsrc.php/zEMOA/hash/c8yzb6ub.js
這些地址都要經歷一個和HTML讀取類似的過程。所以瀏覽器會在DNS中查找這些域名，發送請求，重定向等等...
不像動態頁面，靜態文件會允許瀏覽器對其進行緩存。有的文件可能會不需要與服務器通訊，而從緩存中直接讀取，或者可以放到CDN中
