提高网站的性能之一：关注前端的性能

提高网站的性能之一：关注前端的性能


用户体验 到的 网站性能是前端的性能，简单说是用户打开页面时感受到的速度。
在这方面下些功夫，能够显著提高用户 的体验，和留住用户。

1.更少 的HTTP请求。
方法：
把多个script 组合到一个script文件里。
把多个CSS 组合到一个 CSS文件里。
2.使用内容发布网络（CDN， content delivery network）
方法：
通过一组分布式的WEB服务器向用户提供内容。
3.增加一个Expires 头。
方法：
例如在header中加入这样一句，
Expires: Thu, 1 Jan 2015 20:00:00
那么直到指定的日期之前，浏览器都从本地而不是服务器上取得相应的资源。
4.压缩网页。甚至连script和CSS都压缩。
5.把样式表放在页面头部。
方法：
放在HEAD标签里面。
令浏览器先取得样式信息，再根据此信息渲染页面。
而不是先显示内容，再根据样式表渲染（firefox）,或者等到完全下载了样式表才开始显示内容（IE）。
6.把scripts 放在页面底部。
浏览器在scripts没有下载完成前，不再渲染页面，因此把scripts放在底部，可令浏览器先把内容显示完成。
7.避免使用CSS表达式。
效率低的表达式，可能造成页面死锁。实际上无法预知一个CSS表达式在页面载入时会执行多少遍。
8.把 JavaScript 和 CSS 移出页面。
方法：<scriptsrc=”foo.js“ type=”text/javascript”></script>
CSS也使用类似 的方法。
可以避免每次请求页面都下载 JavaScript 和 CSS。
9.减少DNS查找次数。
方法：
在页面中减少使用域名的次数。
每次DNS查找都会消耗20-100ms。
10.压缩 JavaScript。
可以有效减少script的大小。
11.避免重定向。
12.删除重复 的script。
13.配置ETag。
方法：在服务器上关掉ETag选项。
虽然使用ETag可令浏览器判断是否从服务器取的页面还是从本地取缓存的内容。但是额外增加了访问服务器的次数。
14.使用Ajax缓存。
同样，减少了与服务器的交互次数。

使用YSlow查看网页性能。