许多研究都表明,用户最满意的打开网页时间,是在2秒以下。用户能够忍受的最长等待时间的中位数,在6~8秒之间。这就是说,8秒是一个临界值,如果你的网站打开速度在8秒以上,那么很可能,大部分访问者最终都会离你而去。
Google做过一个试验,显示10条搜索结果的页面载入需要0.4秒,显示30条搜索结果的页面载入需要0.9秒,结果后者使得Google总的流量和收入减少了20%。
Amazon的统计也显示了相近的结果,首页打开时间每增加100毫秒,网站销售量会减少1%。
由此可见,网页的打开速度,对于一个站长,尤其是对于营利性网站来说,是多么重要。但是,从输入网址到网页全部打开,这段时间内,浏览器与服务器之间都发生了什么?时间都消耗在哪里的呢?
雅虎实验室的研究表明,对于大多数网站来说,只有不到10%-20%的响应时间是消耗在从Web服务器上下载HTML文档到浏览器中的。哪另外的80%到90%的时间,消耗到哪里去了呢?
雅虎的前首席性能专家、著名网页性能分析YSlow的创建者Steve Souders的《High Performance Web Sites》(国内翻译为:《高性能网站建设指南》)给大家揭开另外80%-90%的秘密。书中,Souders简要地提出来关于Web前段性能的十四条黄金法则。如下:
- Make Fewer HTTP Requests(尽量减少HTTP请求)
- Use a Content Delivery Network (使用内容分发网络,即CDN)。我前面写过一篇文章,来介绍CDN网络的使用。请看“ 引用新浪、Google、微软的CDN加载jQuery”。
- Add an Expires Header(添加Expires头)
- Gzip Components (压缩组件)
- Put Stylesheets at the Top(把CSS放在HTML最上面)
- Put Scripts to the Bottom (把脚本(比如JavaScript)放到HTML最下面)
- Avoid CSS Expressions(避免使用CSS表达式)
- Make JavaScript and CSS External(使用外部的JavaScript和CSS)
- Reduce DNS Lookups (减少DNS查询次数)
- Minify JavaScript(精简JavaScript)
- Avoid Redirects (避免重定向)
- Remove Duplicate Scripts(删除重复代码)
- Configure ETags (配置ETag)
- Make Ajax Cacheable(使用Ajax缓存)
从十四条黄金法则扩展开来 ,每一条都是一支学习树,看完了解简单,一条一条掌握就来日方长了。这十四条黄金法则让你明白前端优化的准则,自己动手处理的时候有明确目标方向。同时,从这本书里,让我意识到,除了标准的xHTML/CSS/JavaScript,一个优秀的Web开发工程师还应该具备其他几种技能:
精通浏览器工作原理及不同浏览器间的差异 理解HTTP协议 掌握服务器端编程 了解网络环境配置