项目中遇到用setTimeout定时器定时取实时数据绘制折线图，反复操作页面后，出现越来越卡顿的现象

一、所用的技术

1. vue2.0+原生的websocket+setTimeout+自己写delegate订阅观察者

二、出现卡顿的原因

1. delegate中的存事件的list未清除，导致订阅者一直在接收数据触发
2. 以为vue的组件中销毁后会把全局的delegate给销毁了，其实不然需手动销毁
3. 将绘制折线图中的方法定义成为了全局，重复进入时候未清除堆中的对象，重复的 new test导致卡顿

function test（）{
this.aFun = new Rgraph.line();
}

三、解决方案
1. 每次退出组件的时候销毁delegate中的list
2. 将test（）中的this.aFun改为 const、var、let
3. 对于绘制折线的插件，注意冒泡也会影响浏览器的效率

四、小技巧

1. 将收到收到的数据和输出的数据打一个统计值的计数以此来对比
2. 在没有查看浏览器性能的瀑布图、火焰图的时候，用注释某个功能的方法来查找原因