原文：https://mp.weixin.qq.com/s/GICbiyJpINrHZ41u_4zT-A
一金拒、HTTP的歷史

早在 HTTP 建立之初，主要就是為了將超文本標(biāo)記語(yǔ)言(HTML)文檔從Web服務(wù)器傳送到客戶(hù)端的瀏覽器折剃。也是說(shuō)對(duì)于前端來(lái)說(shuō)另假，我們所寫(xiě)的HTML頁(yè)面將要放在我們的 web 服務(wù)器上，用戶(hù)端通過(guò)瀏覽器訪問(wèn)url地址來(lái)獲取網(wǎng)頁(yè)的顯示內(nèi)容怕犁，但是到了 WEB2.0 以來(lái)边篮，我們的頁(yè)面變得復(fù)雜己莺，不僅僅單純的是一些簡(jiǎn)單的文字和圖片，同時(shí)我們的 HTML 頁(yè)面有了 CSS戈轿，Javascript凌受，來(lái)豐富我們的頁(yè)面展示，當(dāng) ajax 的出現(xiàn)思杯，我們又多了一種向服務(wù)器端獲取數(shù)據(jù)的方法胁艰，這些其實(shí)都是基于 HTTP 協(xié)議的。同樣到了移動(dòng)互聯(lián)網(wǎng)時(shí)代智蝠，我們頁(yè)面可以跑在手機(jī)端瀏覽器里面腾么，但是和 PC 相比，手機(jī)端的網(wǎng)絡(luò)情況更加復(fù)雜杈湾，這使得我們開(kāi)始了不得不對(duì) HTTP 進(jìn)行深入理解并不斷優(yōu)化過(guò)程中解虱。

image

二、HTTP的基本優(yōu)化

影響一個(gè) HTTP 網(wǎng)絡(luò)請(qǐng)求的因素主要有兩個(gè)：帶寬和延遲漆撞。

• 帶寬：如果說(shuō)我們還停留在撥號(hào)上網(wǎng)的階段殴泰，帶寬可能會(huì)成為一個(gè)比較嚴(yán)重影響請(qǐng)求的問(wèn)題，但是現(xiàn)在網(wǎng)絡(luò)基礎(chǔ)建設(shè)已經(jīng)使得帶寬得到極大的提升浮驳，我們不再會(huì)擔(dān)心由帶寬而影響網(wǎng)速悍汛，那么就只剩下延遲了。

• 延遲：

• 瀏覽器阻塞（HOL blocking）：瀏覽器會(huì)因?yàn)橐恍┰蜃枞?qǐng)求至会。瀏覽器對(duì)于同一個(gè)域名离咐，同時(shí)只能有 4 個(gè)連接（這個(gè)根據(jù)瀏覽器內(nèi)核不同可能會(huì)有所差異），超過(guò)瀏覽器最大連接數(shù)限制奉件，后續(xù)請(qǐng)求就會(huì)被阻塞宵蛀。

• DNS 查詢(xún)（DNS Lookup）：瀏覽器需要知道目標(biāo)服務(wù)器的 IP 才能建立連接。將域名解析為 IP 的這個(gè)系統(tǒng)就是 DNS县貌。這個(gè)通呈跆眨可以利用DNS緩存結(jié)果來(lái)達(dá)到減少這個(gè)時(shí)間的目的。

• 建立連接（Initial connection）：HTTP 是基于 TCP 協(xié)議的煤痕，瀏覽器最快也要在第三次握手時(shí)才能捎帶 HTTP 請(qǐng)求報(bào)文梧宫，達(dá)到真正的建立連接，但是這些連接無(wú)法復(fù)用會(huì)導(dǎo)致每次請(qǐng)求都經(jīng)歷三次握手和慢啟動(dòng)摆碉。三次握手在高延遲的場(chǎng)景下影響較明顯塘匣，慢啟動(dòng)則對(duì)文件類(lèi)大請(qǐng)求影響較大。

三兆解、HTTP1.0和HTTP1.1的一些區(qū)別

HTTP1.0最早在網(wǎng)頁(yè)中使用是在1996年馆铁，那個(gè)時(shí)候只是使用一些較為簡(jiǎn)單的網(wǎng)頁(yè)上和網(wǎng)絡(luò)請(qǐng)求上，而HTTP1.1則在1999年才開(kāi)始廣泛應(yīng)用于現(xiàn)在的各大瀏覽器網(wǎng)絡(luò)請(qǐng)求中锅睛，同時(shí)HTTP1.1也是當(dāng)前使用最為廣泛的HTTP協(xié)議埠巨。 主要區(qū)別主要體現(xiàn)在：

1. 緩存處理历谍，在HTTP1.0中主要使用header里的If-Modified-Since,Expires來(lái)做為緩存判斷的標(biāo)準(zhǔn)，HTTP1.1則引入了更多的緩存控制策略例如Entity tag辣垒，If-Unmodified-Since, If-Match, If-None-Match等更多可供選擇的緩存頭來(lái)控制緩存策略望侈。

2. 帶寬優(yōu)化及網(wǎng)絡(luò)連接的使用，HTTP1.0中勋桶，存在一些浪費(fèi)帶寬的現(xiàn)象脱衙，例如客戶(hù)端只是需要某個(gè)對(duì)象的一部分，而服務(wù)器卻將整個(gè)對(duì)象送過(guò)來(lái)了例驹，并且不支持?jǐn)帱c(diǎn)續(xù)傳功能捐韩，HTTP1.1則在請(qǐng)求頭引入了range頭域，它允許只請(qǐng)求資源的某個(gè)部分鹃锈，即返回碼是206（Partial Content）荤胁，這樣就方便了開(kāi)發(fā)者自由的選擇以便于充分利用帶寬和連接。

3. 錯(cuò)誤通知的管理屎债，在HTTP1.1中新增了24個(gè)錯(cuò)誤狀態(tài)響應(yīng)碼仅政，如409（Conflict）表示請(qǐng)求的資源與資源的當(dāng)前狀態(tài)發(fā)生沖突；410（Gone）表示服務(wù)器上的某個(gè)資源被永久性的刪除盆驹。

4. Host頭處理圆丹，在HTTP1.0中認(rèn)為每臺(tái)服務(wù)器都綁定一個(gè)唯一的IP地址，因此躯喇，請(qǐng)求消息中的URL并沒(méi)有傳遞主機(jī)名（hostname）辫封。但隨著虛擬主機(jī)技術(shù)的發(fā)展，在一臺(tái)物理服務(wù)器上可以存在多個(gè)虛擬主機(jī)（Multi-homed Web Servers）玖瘸，并且它們共享一個(gè)IP地址秸讹。HTTP1.1的請(qǐng)求消息和響應(yīng)消息都應(yīng)支持Host頭域檀咙，且請(qǐng)求消息中如果沒(méi)有Host頭域會(huì)報(bào)告一個(gè)錯(cuò)誤（400 Bad Request）雅倒。

5. 長(zhǎng)連接，HTTP 1.1支持長(zhǎng)連接（PersistentConnection）和請(qǐng)求的流水線（Pipelining）處理弧可，在一個(gè)TCP連接上可以傳送多個(gè)HTTP請(qǐng)求和響應(yīng)蔑匣，減少了建立和關(guān)閉連接的消耗和延遲，在HTTP1.1中默認(rèn)開(kāi)啟Connection： keep-alive棕诵，一定程度上彌補(bǔ)了HTTP1.0每次請(qǐng)求都要?jiǎng)?chuàng)建連接的缺點(diǎn)裁良。

四、HTTPS與HTTP的一些區(qū)別

• HTTPS協(xié)議需要到CA申請(qǐng)證書(shū)校套，一般免費(fèi)證書(shū)很少价脾，需要交費(fèi)。

• HTTP協(xié)議運(yùn)行在TCP之上笛匙，所有傳輸?shù)膬?nèi)容都是明文侨把，HTTPS運(yùn)行在SSL/TLS之上犀变，SSL/TLS運(yùn)行在TCP之上，所有傳輸?shù)膬?nèi)容都經(jīng)過(guò)加密的秋柄。

• HTTP和HTTPS使用的是完全不同的連接方式获枝，用的端口也不一樣，前者是80骇笔，后者是443省店。

• HTTPS可以有效的防止運(yùn)營(yíng)商劫持，解決了防劫持的一個(gè)大問(wèn)題笨触。

image

五懦傍、SPDY：HTTP1.x的優(yōu)化

2012年google如一聲驚雷提出了SPDY的方案，優(yōu)化了HTTP1.X的請(qǐng)求延遲芦劣，解決了HTTP1.X的安全性谎脯，具體如下：

1. 降低延遲，針對(duì)HTTP高延遲的問(wèn)題持寄，SPDY優(yōu)雅的采取了多路復(fù)用（multiplexing）源梭。多路復(fù)用通過(guò)多個(gè)請(qǐng)求stream共享一個(gè)tcp連接的方式，解決了HOL blocking的問(wèn)題稍味，降低了延遲同時(shí)提高了帶寬的利用率废麻。

2. 請(qǐng)求優(yōu)先級(jí)（request prioritization）。多路復(fù)用帶來(lái)一個(gè)新的問(wèn)題是模庐，在連接共享的基礎(chǔ)之上有可能會(huì)導(dǎo)致關(guān)鍵請(qǐng)求被阻塞烛愧。SPDY允許給每個(gè)request設(shè)置優(yōu)先級(jí)，這樣重要的請(qǐng)求就會(huì)優(yōu)先得到響應(yīng)掂碱。比如瀏覽器加載首頁(yè)怜姿，首頁(yè)的html內(nèi)容應(yīng)該優(yōu)先展示，之后才是各種靜態(tài)資源文件疼燥，腳本文件等加載沧卢，這樣可以保證用戶(hù)能第一時(shí)間看到網(wǎng)頁(yè)內(nèi)容。

3. header壓縮醉者。前面提到HTTP1.x的header很多時(shí)候都是重復(fù)多余的但狭。選擇合適的壓縮算法可以減小包的大小和數(shù)量。

4. 基于HTTPS的加密協(xié)議傳輸撬即，大大提高了傳輸數(shù)據(jù)的可靠性立磁。

5. 服務(wù)端推送（server push），采用了SPDY的網(wǎng)頁(yè)剥槐，例如我的網(wǎng)頁(yè)有一個(gè)sytle.css的請(qǐng)求唱歧，在客戶(hù)端收到sytle.css數(shù)據(jù)的同時(shí)钠绍，服務(wù)端會(huì)將sytle.js的文件推送給客戶(hù)端仍律，當(dāng)客戶(hù)端再次嘗試獲取sytle.js時(shí)就可以直接從緩存中獲取到，不用再發(fā)請(qǐng)求了。SPDY構(gòu)成圖：

image

SPDY位于HTTP之下打毛，TCP和SSL之上置鼻，這樣可以輕松兼容老版本的HTTP協(xié)議(將HTTP1.x的內(nèi)容封裝成一種新的frame格式)栅炒，同時(shí)可以使用已有的SSL功能际歼。

六、HTTP2.0性能驚人

HTTP/2: the Future of the Internet https://link.zhihu.com/?target=https://http2.akamai.com/demo 是 Akamai 公司建立的一個(gè)官方的演示得运，用以說(shuō)明 HTTP/2 相比于之前的 HTTP/1.1 在性能上的大幅度提升膝蜈。 同時(shí)請(qǐng)求 379 張圖片，從Load time 的對(duì)比可以看出 HTTP/2 在速度上的優(yōu)勢(shì)熔掺。

image

七饱搏、HTTP2.0：SPDY的升級(jí)版

HTTP2.0可以說(shuō)是SPDY的升級(jí)版（其實(shí)原本也是基于SPDY設(shè)計(jì)的），但是置逻，HTTP2.0 跟 SPDY 仍有不同的地方推沸，如下：

HTTP2.0和SPDY的區(qū)別：

1. HTTP2.0 支持明文 HTTP 傳輸，而 SPDY 強(qiáng)制使用 HTTPS

2. HTTP2.0 消息頭的壓縮算法采用 HPACK http://http2.github.io/http2-spec/compression.html券坞，而非 SPDY 采用的 DEFLATE http://zh.wikipedia.org/wiki/DEFLATE

八鬓催、HTTP2.0和HTTP1.X相比的新特性

• 新的二進(jìn)制格式（Binary Format），HTTP1.x的解析是基于文本恨锚∮罴荩基于文本協(xié)議的格式解析存在天然缺陷，文本的表現(xiàn)形式有多樣性猴伶，要做到健壯性考慮的場(chǎng)景必然很多课舍，二進(jìn)制則不同，只認(rèn)0和1的組合他挎◇菸玻基于這種考慮HTTP2.0的協(xié)議解析決定采用二進(jìn)制格式，實(shí)現(xiàn)方便且健壯办桨。

• 多路復(fù)用（MultiPlexing）筹淫，即連接共享，即每一個(gè)request都是是用作連接共享機(jī)制的崔挖。一個(gè)request對(duì)應(yīng)一個(gè)id贸街，這樣一個(gè)連接上可以有多個(gè)request，每個(gè)連接的request可以隨機(jī)的混雜在一起狸相，接收方可以根據(jù)request的 id將request再歸屬到各自不同的服務(wù)端請(qǐng)求里面。

• header壓縮捐川，如上文中所言脓鹃，對(duì)前面提到過(guò)HTTP1.x的header帶有大量信息，而且每次都要重復(fù)發(fā)送古沥，HTTP2.0使用encoder來(lái)減少需要傳輸?shù)膆eader大小瘸右，通訊雙方各自cache一份header fields表娇跟，既避免了重復(fù)header的傳輸，又減小了需要傳輸?shù)拇笮　?/p>

• 服務(wù)端推送（server push）太颤，同SPDY一樣苞俘，HTTP2.0也具有server push功能。

九龄章、HTTP2.0的升級(jí)改造

• 前文說(shuō)了HTTP2.0其實(shí)可以支持非HTTPS的吃谣，但是現(xiàn)在主流的瀏覽器像chrome，firefox表示還是只支持基于 TLS 部署的HTTP2.0協(xié)議做裙，所以要想升級(jí)成HTTP2.0還是先升級(jí)HTTPS為好岗憋。

• 當(dāng)你的網(wǎng)站已經(jīng)升級(jí)HTTPS之后，那么升級(jí)HTTP2.0就簡(jiǎn)單很多锚贱，如果你使用NGINX仔戈，只要在配置文件中啟動(dòng)相應(yīng)的協(xié)議就可以了，可以參考**NGINX白皮書(shū)拧廊，NGINX配置HTTP2.0官方指南 **https://www.nginx.com/blog/nginx-1-9-5/监徘。

• 使用了HTTP2.0那么，原本的HTTP1.x怎么辦吧碾，這個(gè)問(wèn)題其實(shí)不用擔(dān)心耐量，HTTP2.0完全兼容HTTP1.x的語(yǔ)義，對(duì)于不支持HTTP2.0的瀏覽器滤港，NGINX會(huì)自動(dòng)向下兼容的廊蜒。

十、附注

HTTP2.0的多路復(fù)用和HTTP1.X中的長(zhǎng)連接復(fù)用有什么區(qū)別溅漾？

• HTTP/1.* 一次請(qǐng)求-響應(yīng)山叮，建立一個(gè)連接，用完關(guān)閉添履；每一個(gè)請(qǐng)求都要建立一個(gè)連接屁倔；

• HTTP/1.1 Pipeling解決方式為，若干個(gè)請(qǐng)求排隊(duì)串行化單線程處理暮胧，后面的請(qǐng)求等待前面請(qǐng)求的返回才能獲得執(zhí)行機(jī)會(huì)锐借，一旦有某請(qǐng)求超時(shí)等，后續(xù)請(qǐng)求只能被阻塞往衷，毫無(wú)辦法钞翔，也就是人們常說(shuō)的線頭阻塞；

• HTTP/2多個(gè)請(qǐng)求可同時(shí)在一個(gè)連接上并行執(zhí)行席舍。某個(gè)請(qǐng)求任務(wù)耗時(shí)嚴(yán)重布轿，不會(huì)影響到其它連接的正常執(zhí)行；
  具體如圖：

image

服務(wù)器推送到底是什么？
服務(wù)端推送能把客戶(hù)端所需要的資源伴隨著index.html一起發(fā)送到客戶(hù)端汰扭，省去了客戶(hù)端重復(fù)請(qǐng)求的步驟稠肘。正因?yàn)闆](méi)有發(fā)起請(qǐng)求，建立連接等操作萝毛，所以靜態(tài)資源通過(guò)服務(wù)端推送的方式可以極大地提升速度项阴。具體如下：

• 普通的客戶(hù)端請(qǐng)求過(guò)程：

image

• 服務(wù)端推送的過(guò)程：

image

為什么需要頭部壓縮？
假定一個(gè)頁(yè)面有100個(gè)資源需要加載（這個(gè)數(shù)量對(duì)于今天的Web而言還是挺保守的）, 而每一次請(qǐng)求都有1kb的消息頭（這同樣也并不少見(jiàn)笆包，因?yàn)镃ookie和引用等東西的存在）, 則至少需要多消耗100kb來(lái)獲取這些消息頭环揽。HTTP2.0可以維護(hù)一個(gè)字典，差量更新HTTP頭部色查，大大降低因頭部傳輸產(chǎn)生的流量薯演。具體參考：HTTP/2 頭部壓縮技術(shù)介紹

HTTP2.0多路復(fù)用有多好？
HTTP 性能優(yōu)化的關(guān)鍵并不在于高帶寬秧了，而是低延遲跨扮。TCP 連接會(huì)隨著時(shí)間進(jìn)行自我「調(diào)諧」，起初會(huì)限制連接的最大速度验毡，如果數(shù)據(jù)成功傳輸衡创，會(huì)隨著時(shí)間的推移提高傳輸?shù)乃俣取＿@種調(diào)諧則被稱(chēng)為 TCP 慢啟動(dòng)晶通。由于這種原因璃氢，讓原本就具有突發(fā)性和短時(shí)性的 HTTP 連接變的十分低效。
HTTP/2 通過(guò)讓所有數(shù)據(jù)流共用同一個(gè)連接狮辽，可以更有效地使用 TCP 連接一也，讓高帶寬也能真正的服務(wù)于 HTTP 的性能提升。

十一喉脖、參考

HTTP/2.0 相比1.0有哪些重大改進(jìn)椰苟？
深入研究：HTTP2 的真正性能到底如何
HTTP/2 頭部壓縮技術(shù)介紹