优化性能

一、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操作时，

尽可能的把获取布局信息代码提前放在一起，便可只进行一次重排

四、使用事件委托

如果给大量元素绑定了事件则会占用比较大内存，

导致开销比较巨大，则建议给每个父元素绑定事件，

通过事件冒泡的形式给子元素委托事件