話說天下大勢，分久必合，合久必分

其實域名也是一樣，分分合合， 不管是域名收斂還是域名發(fā)散，都有著自己獨(dú)特的應(yīng)用場景。
目前, 在web's top 30,000 URLS 里面， 平均每個域名承擔(dān)了50個資源的請求，所以，域名的擴(kuò)散其實是個很重要的手段.
現(xiàn)在大部分website都推崇這域名的發(fā)散
這是為什么呢?為什么呢?為什么呢?

why is domain sharding important?

域名發(fā)散出現(xiàn)的原因其實真得瀏覽器. md~ 以前網(wǎng)速慢，設(shè)備差，稍微流量大一點 Server 就崩潰了。 所以, 為了保護(hù)你的服務(wù)器不被強(qiáng)暴到崩潰，瀏覽器要對max connections 有限制.如果每個用戶的max connections 不限制的話， 結(jié)果就是, 服務(wù)器的負(fù)載能力會低至冰點~
另外還有一個方面就是, 識別用戶不是DDOS attacker. 原因我就不多說了。 如果有大神的話，可以DDOS一下,試一試，表示，我的電腦扛不住.

What does DS(domain sharding) can do?

由于瀏覽器的限制，每個瀏覽器，允許對每個域名的連接數(shù)一般是有上限的.

這是browserscrope生成的結(jié)果.通過這樣圖，我們就可以知道在一些現(xiàn)代瀏覽器內(nèi)每個hostname的最大連接數(shù)基本都是6個，但是IE這個傻逼，不知道抽風(fēng)了么？ 當(dāng)然，如果 進(jìn)行了DS之后 增加連接，也還是有最大的連接數(shù)的(比如17)。
這里，為了講解清晰，我舉個例子吧. 假設(shè)現(xiàn)在瀏覽器對每個域名連接數(shù)為1. 那么現(xiàn)實情況是.

瀏覽器解析完我們的文檔之后開始發(fā)起請求，對文件進(jìn)行加載. 然后一個一個文件 在max connections 下進(jìn)行排隊下載.
但如果我們使用了域名分散之后，使用多個domain進(jìn)行資源的下載，就有.

這樣完全可以省略掉排隊的時間.提升網(wǎng)頁加載的速度.

how to make DS come true?

使用CNAME進(jìn)行設(shè)置

服務(wù)器對于每個域名的限制只是針對于hostname而已, 就算你的IP地址一樣，也是沒有太大關(guān)系的。所以，這里就可以使用CNAME來創(chuàng)建，不同域名相同IP的映射.
CNAME全稱就是Canonical Name。 他是DNS服務(wù)商提供的一項服務(wù)，用來給你的網(wǎng)站設(shè)置別名。
比如，你現(xiàn)在的網(wǎng)站是abc.example.com. 但是，你也想使用def.example.com 來訪問相同的網(wǎng)站， 那么這就需要你使用CNAME 來對你的域名設(shè)置alias. 通常不同的服務(wù)商有著不同的設(shè)置方法. 比如: 國外的maxCDN。
這樣，就能很方便的設(shè)置另外的域名來增加你文件的connections number.
另外,還可以在DNS服務(wù)商下申請子域。這些都是可行的.

DS的最佳實踐

使用DS 并不是一本萬利的。 因為在你增加域的同時，往往會給瀏覽器帶來DNS解析的開銷。如果有興趣的同學(xué)可以參考DNS解析. 對于PC端上,幾十ms的解析速度來說還好，但是，在手機(jī)端上,DNS 解析的效果我就呵呵了. 少則幾百毫秒，多則1s+.
這里我們用數(shù)據(jù)說話.
手機(jī)端頁面加載數(shù)和域名分散數(shù)的關(guān)系. from Mobify Developer

現(xiàn)在，各大瀏覽器都已經(jīng)提升了資源的下載數(shù)，所以，域名分散的必要性也就沒這么大了. 可以從上表看出，在2個域名分散條件下，網(wǎng)頁的加載速度提升較大，而第三個以后就比較慢了。 所以， 一般來說，域名分散的數(shù)量最好在3以下.

那有沒有其他辦法能夠代替DS呢？ 事實上有的， 最出名的應(yīng)該算CDN 和 SPDY.

CDN和域名收斂的關(guān)系(沒關(guān)系)

如果大家使用過云平臺(阿里云,騰訊云)的話，應(yīng)該有所了解過上面的一些服務(wù)。 其中比較出名的應(yīng)該算是CDN服務(wù)了.
使用CDN的時候，我們往往也會使用到CNAME的設(shè)置。 那么問題來了:

CDN 和 domain sharding 到底有什么關(guān)系?

我相信，大部分童鞋，應(yīng)該都有點懵逼.
in fact, 他們兩個是完全不一樣的東西。
CDN 全稱是--Content Delivery Network. 現(xiàn)實意義就是，他其實就是一個 用來保存你靜態(tài)文件的倉庫(css,js,img等). 所以，他的出現(xiàn)必定是建立在擁有眾多服務(wù)器的云平臺上. 他的作用就是，托管你的文件，并且當(dāng)某一個用戶想要得到這份文件時，便會根據(jù)地理位置，找到離用戶最近的一臺服務(wù)器(肯定需要經(jīng)過DNS解析), 然后返回 你存儲的靜態(tài)文件. 所以，由于地理位置比較近的原因，結(jié)果就是網(wǎng)速快, 網(wǎng)頁打開的時間也就變短了.
而~ domain sharding 是什么呢？ 其實對比看來，就應(yīng)該很容易知道, 首先DS(domain sharding) 所提供的服務(wù)器地址是不會改變的。 只是增加了 不同的subdomain或者domain alias而已. 而這些在CDN 里面 統(tǒng)統(tǒng)都可以實現(xiàn).

總結(jié)一下：

• DS: 為了突破瀏覽器對連接數(shù)的限制，而將資源放到不同的domains 上的

• CDN: 就是將你的資源放到 全國 或者說 全世界各個地方的服務(wù)器上的.(當(dāng)然，他本身也是利用DS的技術(shù))

When should we use CDN?

由于CDN 比較貴，所以對于小范圍 運(yùn)營性的H5來說，不使用CDN也沒有太大的影響，反正用戶都在那一塊。 但是，如果你的web 比較大，而且涉及用戶群體的范圍比較廣的話，相對性的使用CDN 也是有益無害的。不過，由于CDN 是按瀏覽計費(fèi)的，所以你懂的。 這里安利一個Calculator根據(jù)你的流量來選擇最佳的CDN. 所以說，你用不用CDN還得看你自己或者你leader的心情了. 另外更詳述的區(qū)別可以見: CDN xx DS

那SPDY又是個什么東西呢？

SPDY指南

SPDY可以說是DS殺手. SPDY 的作用就是，在不增加域名的情況下，解除最大連接數(shù)的限制. 臥槽~ 怎么聽起來就像一個 sliver bullet. 沒錯，可以說SPDY 就是 HTTP2的前身.
SPDY是google主導(dǎo)的一種新型通信方式.主要的特點就是多路復(fù)用. 他的目的就是致力于取消max connections 上限. 不過由于推廣時間短，全世界使用的網(wǎng)頁數(shù)都比較少. 但，據(jù)chromium統(tǒng)計，使用了SPDY網(wǎng)頁速率 差不多提升了28%~64%左右. 所以,說SPDY的出現(xiàn)，可以讓DS的存在變的毫無價值.
那SPDY具體的優(yōu)勢在哪里.

• 解決了HTTP只能 One request per connection. 當(dāng)連接完成后，可以實現(xiàn)并行下載多個資源文件

• 服務(wù)器推的技術(shù), 和SSE的理念類似，不過更靠底層。直接可以實現(xiàn)無需用戶等待，直接后臺發(fā)資源(感覺就像寫APP了，有木有)

• 請求頭的復(fù)用. 當(dāng)你前幾次的請求頭內(nèi)容沒多大變化的時候，就會省去幾個相同的,實現(xiàn)Header Compression

• 數(shù)據(jù)壓縮: 在HTTP1.1 有 Content-Encoding: gzip, Transfer-Encoding: chunked. 來顯式表明開啟文本壓縮。但在SPDY里，所有的文本數(shù)據(jù)默認(rèn)都會被壓縮.
  SPDY目前的兼容性是IE11+.(所以說還是任重而道遠(yuǎn))

開啟SPDY

那如何開啟SPDY呢? 很簡單，使用nginx的用戶，可以下載一個ngx_http_spdy_module的模塊. 使用apache的用戶，可以下載一個mod_spdy module的模塊.

最后說兩句

其實，DS 和 domain of convergence (域名收斂), 一直都是前端世界的優(yōu)化的重點。 不過，由于時代在進(jìn)步，技術(shù)在革新。 感覺DS 是很有可能被淘汰的啊喂. 但，由于SB-IE占的全球份額過大,就目前來說，這一天 還太遙遠(yuǎn)。 加油~

轉(zhuǎn)載請注明作者和原文鏈接: https://segmentfault.com/a/1190000004647665

創(chuàng)作挑戰(zhàn)賽新人創(chuàng)作獎勵來咯，堅持創(chuàng)作打卡瓜分現(xiàn)金大獎

總結(jié)

以上是生活随笔為你收集整理的域名发散--前端优化(三)的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。