第十八章 提升用户体验 之 减少带宽占用
1. 概述
作为开发者，我们总是需要尽量的减少传递的数据量来优化带宽使用。
具体方式包括 清理不用的Js脚本、删除css文件中不用的或者冗余的样式，
还可以使用JS和ASP.NET MVC的绑定和精简特性来删除脚本中的无关信息，然后合并到一个单独的脚本文件供下载。
如果尺寸还是大，还可以考虑使用数据压缩。
优化尺寸以后，还需要考虑最小化网络的影响。最明显的方式就是尽量减少服务端和客户端的交互次数。content delivery network (CDN)会很有帮助。
本章内容包括：整理和优化脚本(CSS and JavaScript)、压缩和解压数据(使用 gip/deflate;storage)、尝试计划CDN策略(比如 Windows Azure CDN)。
2. 主要内容
2.1 整理和优化脚本(CSS and JavaScript)
整理和优化脚本的主要目的就是在下载脚本文件到客户端时，尽量减少带宽和连接的占用。
大部分的常用浏览器都把同一域的连接数限制到了6个。这样的话，尽量减少需要下载的文件数量就可以在这方面改善性能。
同时，对文件进行瘦身（清理空白字符、备注信息、换行符，简化变量名）也是提高性能的一种显著方式。同时还可以混淆文件。
2.1.1 Bundling
ASP.NET MVC 的Bundling特性可以把多个文件绑定到一起下载，用于减少同时的连接数。
这种方式的弊端就是 影响了浏览器的缓存机制，使用时需要权衡。
bundles.Add(new ScriptBundle("~/bundles/myBundle").Include("~/Scripts/myScript1.js",
"~/Scripts/myScript2.js",
"~/Scripts/myScript3.js"));
@BundleTable.Bundles.ResolveBundleUrl(("~/bundles/myBundle")
上面代码还可以为脚本生成hashtag，这样浏览器就会将这个脚本保存更长的时间。
2.1.2 Minifying
Minifying就是精简JS以及CSS文件的大小。
可以通过配置compilation节点的debug属性为false，
或者 在App_Start/BundleConfig.cs文件的 RegisterBundles方法中添加 BundleTable.EnableOptimizations = true 来允许精简操作。
2.2 压缩和解压数据(使用 gip/deflate;storage)
对传递的数据进行压缩也是一种提高性能的方法。header中的Accept-Encoding节点指出了可接受的编码类型。
比如 Accept-Encoding: gzip, deflate ， 说明当前浏览器可以处理 gzip和deflate格式的压缩。
最简单的方式是在IIS中配置压缩选项。
如果使用ASP.NET MVC来压缩文件，有几种action result可以选择。
using (FileStream oFileStream = article.LocalFile.OpenRead())
{
using (FileStream cFileStream = File.Create(
Guid.NewGuid().ToString() + ".gz"))
{
using (GZipStream compressionStream =
new GZipStream(cFileStream, CompressionMode.Compress))
{
oFileStream.CopyTo(compressionStream);
StreamReader reader = new StreamReader(compressionStream);
results = reader.ReadToEnd();
}
}
}
2.3 尝试计划CDN策略(比如 Windows Azure CDN)
CDNs提供了把内容分布到服务器之外的其他地方的一种方式。
引入CDNs的几个目的：
① 把图片、CSS文件、JS文件 等静态文件分出去，减轻主服务器的压力。
② CDNs可以更快速的提供内容给客户端。许多大型CDNs是遍布全球的，可以就近提供服务。
3. 总结
① 当带宽资源不富裕时，可以通过精简文件的大小来提高用户体验。
② 精简文件有几种方式：ASP.NET MVC 4 通过 删除备注、空白 及其他多余字符来精简，还可以通过绑定合并文件来减少链接，提高效率。
③ IIS可以配置Web服务器发送压缩内容到客户端。可以配置只压缩静态文件，或者压缩所有文件。还可以设置一个阈值来启动压缩。
④ CDNs可以把内容分发到更广阔的网络上，分担服务器的压力。CDNs距离客户端更近，用户体验更好。
