前端优化

1、尽量减少HTTP请求个数，合理设置http缓存

减少http的主要手段是合并CSS、合并javascript、合并图片。将浏览器一次访问需要的javascript和CSS合并成一个文件，这样浏览器就只需要一次请求。图片也可以合并，多张图片合并成一张，如果每张图片都有不同的超连接，可通过CSS偏移响应鼠标点击操作。缓存的力量是强大的，恰当的缓存设置可以大大地减少HTTP请求。

2、使用浏览器缓存

对于一个网站而言，CSS、javascript、logo、图标这些静态资源文件更新的频率都比较低，而这些文件又几乎是每次http请求都需要的，如果将这些文件缓存在浏览器中，可以极好的改善性能。通过设置http头中的cache-Control和Expires的属性，缓存时间可以是数天，设置是几个月。

3、避免空的src和href

譬如具有这两个属性的标签：link，script，img，ifram等。

我们经常可以看到这样的情景，在页面加载的过程中，一个有着空src属性的img元素被javascript动态赋值 。这样做的问题是，在脚本执行之前元素就被浏览器渲染了（特别是当你把脚本放在文档最后的时候）。因此浏览器依然会发起一个http请求，尽管它是一个空值。href属性同样存在这样的问题。这样做虽然不影响加载时间，但是会对服务器产生不必要的流量和压力，严重的以至于影响整个网站的用户体验感。

4、开启压缩

在服务器端对文件进行压缩，在浏览器端对文件解压，可有效减少通信传输的数据量。如果可以的话，尽可能将外部的脚本、样式进行合并。文本文件的压缩效率可达到80%以上，所以HTML、CSS和javascript文件启用Gzip压缩可达到较好的效果。但是压缩对服务器和浏览器产生一定的压力，在通信带宽良好，而服务器资源不足的情况下要权衡考虑。

5、CSS放在页面顶部，JS放在页面底部

浏览器会在下载完成全部CSS之后才对整个页面进行渲染，因此最好的做法是将CSS放在页面最上面，让浏览器尽快下载CSS。Js则相反，浏览器在加载JS后立即执行，有可能会阻塞整个页面，造成页面显示缓慢，因此js最好放在页面最下面。

6、CSS Sprites

合并CSS图片是减少请求数的又一个好方法。

7、异步请求callback，即将一些行为样式提取出来，慢慢地加载信息内容。

8、减少cookie传输

Cookie包含在每次请求和响应中，太大的cookie会严重影响数据传输，因此哪些数据需要写入cookie需要谨慎考虑，尽量减少cookie中传输的数据量。

9、js代码的优化

（1）dom使用访问

（2）慎用with，with相当于增加了作用域长度，而每次查找作用域都是要消耗时间的，过长的作用域会导致查找性能下降。

（3）减少作用域链查找，同时还应减少闭包的使用。（譬如：局部变量与全局变量的使用）

（4）字符串拼接。使用“+号来拼接效率是比较低的，可根据实际情况选择数组的join方法。

（5）避免使用function和eval，他们对浏览器性能有很大影响。同时，使用这两者也不利于JS压缩工具执行压缩。

10、CSS选择符优化

浏览器对选择符的解析式从右往左进行的。