最近逛博客看到的有关性能优化的东西

包括两个部分，一部分是有关于CSS动画这一方面的，另一部分是关于js性能方面的

1.使用 transform3d api 代替 transform api，可以强制开启 GPU 加速，提升网站动画渲染性能；

2.使用 CSS3 will-change 提高页面滚动、动画等渲染性能;

3.chrome对于渲染很多大尺寸图片(尤其是alpha透明度PNG24图片)方面有先天的不足，从它版本10+的时候就有开发者在官方平台报过这个Bug，如今chrome已经更新至版本30+，却依旧没有完美解决这个顽疾。

通过-webkit-transform:transition3d/translateZ开启GPU硬件加速之后，有些时候可能会导致浏览器频繁闪烁或抖动，可以尝试以下办法解决之：
-webkit-backface-visibility:hidden;
-webkit-perspective:1000;

4.不要重构对象

重构对象是很昂贵的操作，遵循下面的建议来避免：

不使用 delete 操作符

删除一个属性，用 delete 会比通过 null 赋值慢很多，在火狐和 Chrome 中，
null 赋值会快 99%，因为它不会修改对象的结构，但是 delete 会。

不要添加属性

定义对象后，不要随后给对象添加属性，而是一开始就应该定义好对象的结构模式，
这样运行速度会快很多(火狐上快 100%，Chrome 上快 89%)。

5.声明 & 传递局部作用域变量

当调用一个函数时，浏览器会进行 作用域查找 ，这个时间花销跟浏览器要查找的作用域数有关。不要依赖全局/高层作用域变量，而是创建局部作用域变量，然后传递给函数。查找的作用域数越少，就运行更快。

6.对于耗时任务，使用 Web Workers

如果你有非常耗时的计算任务，如图像处理，最好使用 Web Workers 让浏览器在后台线程中运行这个任务，并且异步返回处理结果，而不是挂起线程。

7.jquery中各个事件执行顺序如下：

1.ajaxStart(全局事件)
2.beforeSend
3.ajaxSend(全局事件)
4.success
5.ajaxSuccess(全局事件)
6.error
7.ajaxError (全局事件)
8.complete
9.ajaxComplete(全局事件)
10.ajaxStop(全局事件)

8.firefox中的canvas对于颜色的渲染有一定的问题，阴影的边界颜色混合会变得很深。
有图有真相:

前面一张是在chrome里面看到的效果，后面一张是在firefox里看到的效果。

9.让渲染方法极大提升的3个小tips:

background-attachment: fixed改成 position: fixed，因为前面这玩意滚动实时计算重绘；
背景图片所在的元素替换为::before伪元素；
使用了CSS3 will-change 加速；