一、Dom操作
1.使用fragment批量处理dom元素然后添加到页面中
2.在进行dom操作前隐藏dom元素 操作完毕后 进行显示 这样仅只重绘两次
3.把需要进行dom操作的元素克隆进行处理然后替换页面上的元素 仅进行一次重绘渲染
var old=document.querySeletor(class)
var clone=old.cloneNode(true);
old.parentNode.replace(clone,old);
进行获取dom属性时 如果存在复用 切记进行缓存 不要重复的获取某个元素的属性
二、Dom动画
给有动画效果的元素设定绝对定位脱离文档流,
避免页面频繁重绘 动画仅影响自身重绘渲染
三、优化连续获取Dom布局信息操作
当获取元素的布局信息时页面会强制重新渲染,
但是浏览器会优化连续的dom操作,
所以当需要获取大量的dom布局信息或者进行大量的dom操作时,
尽可能的把获取布局信息代码提前放在一起,便可只进行一次重排
四、使用事件委托
如果给大量元素绑定了事件则会占用比较大内存,
导致开销比较巨大,则建议给每个父元素绑定事件,
通过事件冒泡的形式给子元素委托事件