web app优化

手机端优化：

不滥用Float

Float在渲染时计算量比较大，尽量减少使用

不滥用Web字体

Web字体需要下载，解析，重绘当前页面，尽量减少使用

不声明过多的Font-size

过多的Font-size引发CSS树的效率

减少重绘和回流

a) 避免不必要的Dom操作

b) 尽量改变Class而不是Style，使用classList代替className

c) 避免使用document.write

d) 减少drawImage

Viewport可以加速页面的渲染，请使用以下代码

< meta name=”viewport”content=“width=device-width, initial-scale=1″>

动画优化

a) 尽量使用CSS3动画

b) 合理使用requestAnimationFrame动画代替setTimeout

c) 适当使用Canvas动画 5个元素以内使用css动画，5个以上使用Canvas动画（iOS8可使用webGL）

GPU加速

CSS中以下属性（CSS3 transitions、CSS3 3D transforms、Opacity、Canvas、WebGL、Video）来触发GPU渲染，请合理使用

PS：过渡使用会引发手机过耗电增加