13如何优化渲染?
具体方法如下。(1)通过HTML设置Viewport元标签,Viewport可以加速页面的渲染,如以下代码所示。<metaname="viewport"content="width=device=width,initial-scale=1">(2)减少DOM节点数量,DOM节点太多会影响页面的渲染,应尽量减少DOM节点数量。(3)尽量使用CSS3动画,合理使用requestAnimationFrame动画代替setTimeout,适当使用canvas动画(5个元素以内使用CSS动画,5个元素以上使用canvas动画(iOS8中可使用webGL))。(4)对于高频事件优化Touchmove,Scroll事件可导致多次渲染。使用requestAnimationFrame监听帧变化,以便在正确的时间进行渲染,增加响应变化的时间间隔,减少重绘次数。使用节流模式(基于操作节流,或者基于时间节流),减少触发次数。(5)提升GPU的速度,用CSS中的属性(CSS3transitions、CSS33Dtransforms、Opacity、Canvas、WebGL、Video)来触发GPU渲染。
来自:浏览器、网络相关-性能和加载优化