提高网站速度的最佳实践【翻译】
原文地址是这个地方:http://developer.yahoo.com/performance/rules.html,英语水平有限,翻译可能不到位,自己再看看这个英文原版了。
1.最小化HTTP请求
终端用户响应时间的80%用在前端显示上,大部分时间浪费在下载页面组件上面,比如:图片,css样式,flash,脚本等等,降低返回的http请求的页面的组件数量,这是加快页面的重要环节。
减少页面组件的一个方法就是简化页面设计,但是如果要设计一个富页面应用的web系统如何减少组件呢?下面有些技术可减少http请求,同时可以开发富页面程序
css样式是减少图片数量的一个比较好的方法,把你的背景图片组合一个单独的图片,而且使用css的background-image和background-position去显示渴望的图片效果
图片管理:把多个图片组合成为一个图片,虽然图片的大小没有变化,但是减少了http请求的数量。如果这些图片比较接近可以使用这个办法,比如导航条的位置。(该方法并不推荐)
内嵌图片:使用 data:
URL scheme把图片嵌入到真正的页面中。这样会增加html文档的大小,这样可以减少http请求,(内嵌图片不支持部分浏览器),所以推荐使用css来加载图片,而不是在html中直接使用img标签
降低http请求数量是最重要的,这是提高用户访问性能的最重要的指导规则。
2.使用内容分发网络(Content delivery network)
用户距离你的网络服务远近对响应时间也是有影响的,部署多个服务器,按照地理位置划分你的服务器可以使用你的页面加载更快,但是应该从哪里开始呢?
首先实现按地理位置划分内容,不要试图重新设计你的web程序成为分布式架构,依赖这个程序,改变架构是一个很复杂可怕的工作,比如同步session状态,数据库同步等。企图降低用户和你内容服务直接的距离这个工作会被推迟的,甚至不会通过。
记住用户响应时间的80用在下载页面的组件上面。这是一个“黄金法则”,所以不要去重新设计你的程序架构,最好首先去划分你的静态内容,这不是唯一的降低响应时间的方法,但是因为内容分发服务器这是最简单的方法。
内容分发服务器(cdn)是一组分布式部署的web服务的集合,可以更有效的把内容传递给用户,服务器传递内容给距离他最近的用户
一些大型互联网公司有自己的cdn。我们也可以使用cdn服务器提高的服务,这种方式是比较廉价而且有效益的。
3.添加一个过期失效或者缓存控制的头标记
在这个规则有两个事情
(a)对静态组件实现永远不过期策略
(b)对动态组件:适当的使用缓存控制。
4.Gzip 组件(压缩组件)
压缩可以降低请求的响应时间。在http1.1协议中客户端指名支持的压缩协议,
Accept-Encoding: gzip, deflate
如果web服务器看到这个请求头,就会用客户端指定的方法来压缩返回的内容。
Gzip就是当前最流行的压缩算法
5.把样式表放在文件顶端
6.把脚本房子文件底部
7.避免css表达式运算
8.把css和js脚本放到外置文件中
9.降低dns的检查
10.缩小css文件和js文件
11.避免重定向
12.去掉重复的脚本
13.配置标签
14.使ajax具有缓存功效
15,尽早的清空缓存
16.使用Get方式去请求(如果数据小的话可以使用)
17.加载后使用组件(Post—Load)
18.预先加载组件(PreLoad)
19.减少dom文档的数量
20.跨域分割组件
21.少使用iframe
22.不要使用404错误信息,自己收到实现这个404错误的提示方式
23.少使用cookie
24.使用无cookie的域为组件
25.减少对dom的访问操作
26.开发灵活的事件处理方式
27.Choose <link> over @import
28。避免使用滤镜
29.优化图片
30.优化css样式
31.不要按照比例使用图片(比如500*500的 图片,在html中不要使用100*100的方式)
32.使图标更小,可以缓存
33.使组件小于25k
34.把多个组件封装成多方可以使用的组件
本文使用Blog_Backup未注册版本导出,请到soft.pt42.com注册。