一个大小为13883bytes的280*90px的小图片的分析结果(点击图片可以查看完整大图片)

　　第一张大图片花费时间为：

　　Blocked：13.034s

　　Send：0.001s

　　Wait：0.163s

　　Receive：4.596s

　　TTFB：0.164s

　　NetWork：4.760s

　　功耗时：17.795s

　　真正用于传输大文件花费的时间为Reveive时间，即4.596s，多数的时间是用来检索缓存和确定链接是否有效的Blocked时间，供花费13.034s，占总时间的73.2%。

　　第二张小图片花费时间为：

　　Blocked：16.274s

　　Send：小于0.001s

　　Wait：0.117s

　　Receive：0.397s

　　TTFB：0.118s

　　NetWork：0.516s

　　功耗时：16.790s

　　真正用于传输文件的花费时间是Reveive时间，即0.397s，这的确要比刚才大文件的4.596s小很多。但是他的Blocked时间为16.274s，占总时间的97%。

　　大文件和小文件下载所需时间的确是不同的，差异的绝对值不大。而且下载所需时间占总耗费时间比例很小。

　　大约80%以上的时间是用来检索缓存和确定链接是否有效的Blocked时间。无论文件大小，这个时间的花费大致是相同的。而且所占总耗费时间的比例是极大的。

　　一个100k的大图片总耗费时间绝对大于4个25k的小图片的总耗费时间。而且主要差别就是4个小图片的Blocked时间绝对大于1个大图片的Blocked时间。

　　所以如果可能还是使用大图片来替代过多的琐碎的小图片吧。这也是为什么翻转门的效率要高于图片替换实现的滑动门的原因。

　　但是，请注意：也不能用太大的单张图片，因为那样会影响到用户体验。例如个几兆的背景图片的使用绝对不是一个好主意。

　　2：合并你的css文件。

　　图:合并与融合我以前犯了一个错误，你在看我《样式表的组织与规划》的系列文章中会知道。当时，我为了方便组织和规划样式表，将用于不同用途的样式表文件分离开来，形成不同的css文件。然后在页面中根据需要引用多个css文件。

　　第二条：Use a Content Delivery Network 使用CDN

　　第十条：Minify JavaScript and CSS 减少JavaScript和CSS文件的体积

　　这点很好理解。在你的最终发布版本中把没有必要的空行、空格和注释全部去掉。显然手工去处理效率太低，好在网上到处都是用于压缩这些东西的工具。压缩JavaScript代码体积的工具随处可见，我便不再列举了。

　　它提供了多种压缩方式，可以适应多种要求。

　　第十一条：Avoid Redirects 避免跳转