网站无线链路的优化

发布：2018-11-29 17:10:32 浏览：3941

服务端响应时间只占整个请求路径上很小的一部分，PC上更重要的是优化首屏的加载，无线端更多则是优化中间的管道。

1.无线端请求合并

无线环境下做请求合并的收益是比较大的，所以会将当前的两次请求在服务端做ESI合并为一个请求。在无线环境下减少请求的数量可以明显减少总耗时。

无线环境下数据大小对性能的影响比在PC端的更明显，PC端数据从20KB到80KB增加了100毫秒，而无线端数据从20KB到80KB增加了700毫秒。因此是否能控制页面大小对无线端的性能影响很大。

综上，我们得出如下结论。

在无线环境下，减少网络请求次数对首屏加载性能有比较明显的影响；

无线环境下的文件大小与PC环境下的文件大小对性能的影响效果不同:无线环境下的数据大小对性能影响比在PC环境下的更明显，所以是否能控制页面大小对无线环境下的性能影响很大；

CDN直接Cache可以大幅提升性能，所以尽量将数据Cache到CDN，这对无线端同样是有效的；

小数据情况下，动态加速和直接回主站没有明显优势，再加上当前动态加速链路还在调优中，所以当前无线数据直接回统一Cache比较理想，待动态加速更加成熟后再走CDN。

3.CDN动态加速

CDN的动态加速技术也是比较流行的一种优化技术，它的技术原理就是在CDN的DNS解析中通过动态的链路探测来寻找回源最好的一条路径，然后通过DNS的调度将所有请求调度到选定的这条路径上回源，从而提高用户访问的效率。

由于CDN节点是遍布全国的，所以用户接人一个CDN节点后，可以选择一条从自己最近的CDN节点到源站链路的最好路径。这里的一个简单原则就是在每个CDN节点上，从源站下载一个一定大小的文件，看哪条链路的总耗时最短。这样可以构成一个链路列表，然后绑定到DNS解析上、更新到CDN的LocalDNS。当然，是否走这条链路并不定只依据“耗时”这个唯一条件，有时候也要考虑网络成本，例如走某个节点虽然可以节省10毫秒时间，但是网络带宽成本却增加很多，还要综合考虑网络链路安全等其他因素。

4.WebP图片优化

WebP是一种同时提供了有损压缩与无损压缩的图片文件格式，派生自图像编码格式VP8。WebP最初在2010年发布，目标是缩小文件并达到和JPEG格式相同的图片质量，以便节省图片文件的网络传送时间。

Chrome浏览器以及Chromium内核的浏览器都支持WebP格式的图片，Android4.0以上也都原生支持该类型图片。根据caniusecom的统计，目前约有70%的用户可以享受到WebP格式带来的好处。

(1)WebP带来的收益

节约的带宽=CDN流量x可以使用WebP格式图片的流量占比x支持WebP的浏览器占比xWebP格式压缩率(实测为38%~41%)。从公式可知，带宽收益与CDN流量、支持WebP的浏览器(主要是Chrome内核浏览器)占比、页面中可以使用WebP格式的图片占比成正比。

我们以商品详情系统的放大镜图片(40x40/310x310)和所有装修中的图片使用WebP为例，计算出详情系统使用WebP后，一个月大约会节约数十万元左右的带宽费用，非常可观。

(2)最佳实践

WebP有m0~m6等7种压缩级别，一般来说级别越高画质越好。但级别越高转换为WebP所要消耗的CPU资源也更多。在用WebP转换图片时要注意以下问题。

①转换为WebP图片的时候，使用有损压缩(与m0~m6压缩级别无关)会导致:红色字体被压缩之后普遍偏暗；

部分蓝色字体被压缩之后偏模糊；

当背景为黑色的时候，红色小字体偏模糊；当背景为红色的时候，黑色小字体偏模糊。

②低版本的Chrome浏览器不支持透明通道的WebP，所以对PNG图片不能使用WebP格式。

③gif转换为WebP动画非常耗性能，所以只处理第一帧图片。

④原图转换成WebP非常耗性能，图片的所有缩略图(如310x310)都是先转换为JPEG格式，再转换为WebP格式。

通过分析近万张图片我们得出以下结论:网站制作压缩级别在m0~m2时，不少图片丢失色块(出现马赛克)，压缩级别为m3及以上时则极少出现此问题，同时m3级别所节约的带宽和m4级别是非常接近的，但m3的转化性能明显高于m4。因此，我们决定使用m3级别。