1、影响网站性能的来源5%来自后端,而前端达到了95%
2、这些研究成果来自不断的量化、性能研究和时间
具体的14条准则:
Make Fewer HTTP Requests
减少服务端的请求数量(小图片合并成一个图片,通过CSS定位来定位图标,更好的利用浏览器的缓存功能,JavaScript尽可能合并为一个文件,样式表也要合并成一个文件)
Use a Content Delivery Network
尽量使用内容分发功能,通过内容静态化,使内容尽可能的接近用户
Add an Expires Header
文件增加一个过期页头
Gzip Components
使用Gzip进行页面压缩
Put CSS at the Top
将样式表文件放到<head>标签中,因为在IE中CSS文件没有加载完会影响页面的展示
Move Scripts to the Bottom
将脚本文件放到页面底部,因为JavaScript在处理的过程中会阻塞后边的文件
Avoid CSS Expressions
避免样式文件过期
Make JavaScript and CSS External
将脚本和样式文件放到外部
Reduce DNS Lookups
减少DNS的解析时间
Minify JavaScript
最小化脚本,例如混淆脚本
Avoid Redirects
避免跳转
Remove Duplicate Scripts
移除重复脚本
Configure ETags
配置ETags
Make Ajax Cacheable
使用Ajax缓存
补充:
1、页面采用xhtml,采用Div+Css布局,将样式表和xhtml文件分开,使样式文件可以做缓存处理
2、目前大多数浏览器都支持Gzip,可以将文本、静态页面、样式表、脚本进行压缩,减少内存读取时间
3、可以通过缓存服务器如squid进一步提高客户端的访问性能
4、限制Cookie的应用域、响应目录和过期时间,减少Cookie的请求,一个3k的Cookie能够增加延迟到80ms
5、页面由2~4个不同域名的服务器提供服务能提高速度,如页面由A提供,样式由B提供,图片由C提供,这样浏览器可以同时从多个服务器下载文件
6、对爬虫进行限制
7、访问压力过大也要考虑集群处理
8、做好数据库的优化工作
综上可以看出前端的优化主要是极大的利用浏览器的缓存特性,从而达到几乎本地的访问速度,同时尽可能的降低对服务器性能的消耗,而这些前端优化是我们在日常工作中可以做到的。