一、加载优化
加载过程是最为耗时的过程，可能会占到总耗时的80%时间，因此是优化的重点
1、减少HTTP请求
因为手机浏览器同时响应请求为4个请求，所以要尽量减少页面的请求数，首次加载同时请求数不能超过4个
a) 合并CSS、JavaScript
b) 合并小图片，使用雪碧图
2、缓存
使用缓存可以减少向服务器的请求数，节省加载时间，所以所有静态资源都要在服务器端设置缓存，并且尽量使用长Cache（长Cache资源的更新可使用时间戳）
a) 缓存一切可缓存的资源
b) 使用长Cache（使用时间戳更新Cache）
c) 使用外联式引用CSS、JavaScript
3、压缩HTML、CSS、JavaScript
减少资源大小可以加快网页显示速度，所以要对HTML、CSS、JavaScript等进行代码压缩，并在服务器端设置GZip
a) 压缩（例如，多余的空格、换行符和缩进）
b) 启用GZip
4、无阻塞
写在HTML头部的JavaScript（无异步），和写在HTML标签中的Style会阻塞页面的渲染，因此CSS放在页面头部并使用Link方式引入，避免在HTML标签中写Style，JavaScript放在页面尾部或使用异步方式加载
5、使用首屏加载
首屏的快速显示，可以大大提升用户对页面速度的感知，因此应尽量针对首屏的快速显示做优化
6、 按需加载
将不影响首屏的资源和当前屏幕资源不用的资源放到用户需要时才加载，可以大大提升重要资源的显示速度和降低总体流量
a) LazyLoad
b) 滚屏加载
c) 通过Media Query加载
7、 预加载
大型重资源页面（如游戏）可使用增加Loading的方法，资源加载完成后再显示页面。但Loading时间过长，会造成用户流失
对用户行为分析，可以在当前页加载下一页资源，提升速度
a) 可感知Loading(如进入空间游戏的Loading)
b) 不可感知的Loading（如提前加载下一页）
二、CSS优化
1、尽量避免写在HTML标签中写Style属性
2、避免CSS表达式
CSS表达式的执行需跳出CSS树的渲染，因此请避免CSS表达式
3、移除空的CSS规则
空的CSS规则增加了CSS文件的大小，且影响CSS树的执行，所以需移除空的CSS规则
4、正确使用Display的属性
Display属性会影响页面的渲染，因此请合理使用
a) display:inline后不应该再使用width、height、margin、padding以及float
b) display:inline-block后不应该再使用float
c) display:block后不应该再使用vertical-align
d) display:table-*后不应该再使用margin或者float
5、不滥用Float
Float在渲染时计算量比较大，尽量减少使用
6、不滥用Web字体
Web字体需要下载，解析，重绘当前页面，尽量减少使用
7、不声明过多的Font-size
过多的Font-size引发CSS树的效率
三、渲染优化
1、HTML使用Viewport
Viewport可以加速页面的渲染，请使用以下代码
<meta name=”viewport” content=”width=device-width, initial-scale=1″>
2、减少Dom节点
Dom节点太多影响页面的渲染，应尽量减少Dom节点
3、动画优化
a) 尽量使用CSS3动画
b) 合理使用requestAnimationFrame动画代替setTimeout
c) 适当使用Canvas动画 5个元素以内使用css动画，5个以上使用Canvas动画（iOS8可使用webGL）
4、高频事件优化
Touchmove、Scroll 事件可导致多次渲染
a) 使用requestAnimationFrame监听帧变化，使得在正确的时间进行渲染
b) 增加响应变化的时间间隔，减少重绘次数
参考资料：移动网站性能优化 http://www.studyofnet.com/news/811.html