标签：
综合来看，优化前端网页性能有以下几种方式：
网页内容、服务器、图片、cookie、css/js文件处理等方式。
1、网页内容：
通过减少http请求，减少DNS查询，延时加载不急切需要的内容，提前加载将要需要的内容，不要404页面，不用iframe等方式。
减少http请求次数：将文件捆绑打包，将图片合并。
减少DNS 查询：本地上可以清除DNS记录，但是这只能让本地浏览速度加快，服务器上怎么设置呢？
2、服务器：
通过设置服务器使得提高网页性能的方式并不是很熟练。主要有以下等方式：
CDN、Expires/Cache-Control、Gzip、Etags、Get Ajax 、避免空src
cdn：分布式存储、负载均衡、网络请求的重定向和内容管理（就是将网站的内容发布到最接近用户的网络"边缘""，使用户可以就近取得所需的内容，解决Internet网络拥塞状况，提高用户访问网站的响应速度。）
Expires/Cache-Control：静态内容永不过期，动态内容动态加载。
Gzip：是个效率提升的好东西，zip通常可以减少70%网页内容的大小，包括脚本、样式表、图片等文件。需要配置iis。
Etags：就是将网页内容标记，然后让服务器更好判断这是神马东东。
Get：get比post快。。。
当然要避免空的src了，空的还要发送一个请求，然后浏览器还要返回个空值，不浪费才怪。。。
3、图片：
优化图片（就是让它小，更小，或者在移动设备上用媒体查询的方式让它小。。。）。
css sprite ：一个神奇的拼图片，然后再切图片的想法。
如何切？ （人家是用position定位的，没错，就是这么简单粗暴。）
why用它？ 对于小的图标还是蛮合适的，但是公司好像并没有经常用到它，然并卵。。。
不要在html中缩放图片，如果用小图，就把图弄小。。。 （这个美工负责么？）
4、cookies
由于cookies是在http的报头中，所以如果不用cookies就把它禁了吧，用到也尽量减小它。
5、css/js
将css文件放在head中，因为这样做可以使浏览器逐步加载已将下载的网页内容，然后就慢慢看到了它加载完成的东西啦，不用面对个白屏。
尽量不用css表达式（这个真不经常用，类似if else语句的东西(new Date()).getHours()%2 ? "#B8D4FF" : "#F08A00" ）丑丑的语句。
js写在body里，这个我们知道，因为它会阻塞加载。
去除重复脚本，线上环境下，去除空格注释也可。
好吧，这么多条，终于总结完了，除了服务器上的设置，其他的已经基本搞清楚怎么回事了，以后多接触，多学习，多捣鼓。
标签：
原文地址：http://www.cnblogs.com/vvy-404/p/4618658.html
