前端优化--域名发散

kart 9年前

话说天下大势，分久必合，合久必分

其实域名也是一样，分分合合， 不管是域名收敛还是域名发散，都有着自己独特的应用场景。
目前, 在web's top 30,000 URLS 里面， 平均每个域名承担了50个资源的请求，所以，域名的扩散其实是个很重要的手段.
现在大部分website都推崇这域名的发散
这是为什么呢?为什么呢?为什么呢?

why is domain sharding important?

域名发散出现的原因其实真得浏览器. md~ 以前网速慢，设备差，稍微流量大一点 Server 就崩溃了。 所以, 为了保护你的服务器不被强暴到崩溃，浏览器要对max connections 有限制.如果每个用户的max connections 不限制的话， 结果就是, 服务器的负载能力会低至冰点~
另外还有一个方面就是, 识别用户不是DDOS attacker. 原因我就不多说了。 如果有大神的话，可以DDOS一下,试一试，表示，我的电脑扛不住.

What does DS(domain sharding) can do?

由于浏览器的限制，每个浏览器，允许对每个域名的连接数一般是有上限的.

这是browserscrope生成的结果.通过这样图，我们就可以知道在一些现代浏览器内每个hostname的最大连接数基本都是6个，但是IE这个傻逼，不知道抽风了么？ 当然，如果 进行了DS之后 增加连接，也还是有最大的连接数的(比如17)。
这里，为了讲解清晰，我举个例子吧. 假设现在浏览器对每个域名连接数为1. 那么现实情况是.

浏览器解析完我们的文档之后开始发起请求，对文件进行加载. 然后一个一个文件 在max connections 下进行排队下载.
但如果我们使用了域名分散之后，使用多个domain进行资源的下载，就有.

这样完全可以省略掉排队的时间.提升网页加载的速度.

how to make DS come true?

使用CNAME进行设置

服务器对于每个域名的限制只是针对于hostname而已, 就算你的IP地址一样，也是没有太大关系的。所以，这里就可以使用CNAME来创建，不同域名相同IP的映射.
CNAME全称就是Canonical Name。 他是DNS服务商提供的一项服务，用来给你的网站设置别名。
比如，你现在的网站是abc.example.com. 但是，你也想使用def.example.com 来访问相同的网站， 那么这就需要你使用CNAME 来对你的域名设置alias. 通常不同的服务商有着不同的设置方法. 比如: 国外的maxCDN。
这样，就能很方便的设置另外的域名来增加你文件的connections number.
另外,还可以在DNS服务商下申请子域。这些都是可行的.

DS的最佳实践

使用DS 并不是一本万利的。 因为在你增加域的同时，往往会给浏览器带来DNS解析的开销。如果有兴趣的同学可以参考DNS解析. 对于PC端上,几十ms的解析速度来说还好，但是，在手机端上,DNS 解析的效果我就呵呵了. 少则几百毫秒，多则1s+.
这里我们用数据说话.
手机端页面加载数和域名分散数的关系. from Mobify Developer

现在，各大浏览器都已经提升了资源的下载数，所以，域名分散的必要性也就没这么大了. 可以从上表看出，在2个域名分散条件下，网页的加载速度提升较大，而第三个以后就比较慢了。 所以， 一般来说，域名分散的数量最好在3以下.

那有没有其他办法能够代替DS呢？ 事实上有的， 最出名的应该算CDN 和 SPDY.

CDN和域名收敛的关系(没关系)

如果大家使用过云平台(阿里云,腾讯云)的话，应该有所了解过上面的一些服务。 其中比较出名的应该算是CDN服务了.
使用CDN的时候，我们往往也会使用到CNAME的设置。 那么问题来了:

CDN 和 domain sharding 到底有什么关系?

我相信，大部分童鞋，应该都有点懵逼.
in fact, 他们两个是完全不一样的东西。
CDN 全称是--Content Delivery Network. 现实意义就是，他其实就是一个 用来保存你静态文件的仓库(css,js,img等). 所以，他的出现必定是建立在拥有众多服务器的云平台上. 他的作用就是，托管你的文件，并且当某一个用户想要得到这份文件时，便会根据地理位置，找到离用户最近的一台服务器(肯定需要经过DNS解析), 然后返回 你存储的静态文件. 所以，由于地理位置比较近的原因，结果就是网速快, 网页打开的时间也就变短了.
而~ domain sharding 是什么呢？ 其实对比看来，就应该很容易知道, 首先DS(domain sharding) 所提供的服务器地址是不会改变的。 只是增加了 不同的subdomain或者domain alias而已. 而这些在CDN 里面 统统都可以实现.

总结一下：

  • DS: 为了突破浏览器对连接数的限制，而将资源放到不同的domains 上的

  • CDN: 就是将你的资源放到 全国 或者说 全世界各个地方的服务器上的.(当然，他本身也是利用DS的技术)

When should we use CDN?

由于CDN 比较贵，所以对于小范围 运营性的H5来说，不使用CDN也没有太大的影响，反正用户都在那一块。 但是，如果你的web 比较大，而且涉及用户群体的范围比较广的话，相对性的使用CDN 也是有益无害的。不过，由于CDN 是按浏览计费的，所以你懂的。 这里安利一个Calculator根据你的流量来选择最佳的CDN. 所以说，你用不用CDN还得看你自己或者你leader的心情了. 另外更详述的区别可以见: CDN xx DS

那SPDY又是个什么东西呢？

SPDY指南

SPDY可以说是DS杀手. SPDY 的作用就是，在不增加域名的情况下，解除最大连接数的限制. 卧槽~ 怎么听起来就像一个 sliver bullet. 没错，可以说SPDY 就是 HTTP2的前身.
SPDY是google主导的一种新型通信方式.主要的特点就是多路复用. 他的目的就是致力于取消max connections 上限. 不过由于推广时间短，全世界使用的网页数都比较少. 但，据chromium统计，使用了SPDY网页速率 差不多提升了28%~64%左右. 所以,说SPDY的出现，可以让DS的存在变的毫无价值.
那SPDY具体的优势在哪里.

  • 解决了HTTP只能 One request per connection. 当连接完成后，可以实现并行下载多个资源文件

  • 服务器推的技术, 和SSE的理念类似，不过更靠底层。直接可以实现无需用户等待，直接后台发资源(感觉就像写APP了，有木有)

  • 请求头的复用. 当你前几次的请求头内容没多大变化的时候，就会省去几个相同的,实现Header Compression

  • 数据压缩: 在HTTP1.1 有 Content-Encoding: gzip, Transfer-Encoding: chunked. 来显式表明开启文本压缩。但在SPDY里，所有的文本数据默认都会被压缩.
    SPDY目前的兼容性是IE11+.(所以说还是任重而道远)

开启SPDY

那如何开启SPDY呢? 很简单，使用nginx的用户，可以下载一个ngx_http_spdy_module的模块. 使用apache的用户，可以下载一个mod_spdy module的模块.

最后说两句

其实，DS 和 domain of convergence (域名收敛), 一直都是前端世界的优化的重点。 不过，由于时代在进步，技术在革新。 感觉DS 是很有可能被淘汰的啊喂. 但，由于SB-IE占的全球份额过大,就目前来说，这一天 还太遥远。 加油~

原文 https://segmentfault.com/a/1190000004647665