素材巴巴 > 程序开发 >

Echarts 释放资源

程序开发 2023-09-15 15:47:52

Echarts 释放资源

当我们使用echarts进行视图渲染的时候,我们一般都会使用定时器来进行试图的更新,我们会发现页面开的越久就会变得很卡,我们打开任务管理器发现,内存在稳定的上升,这就是内存的泄露。

这是因为,我们的定时器没有取消,而是再一直叠加,我们再启动定时器的时候我们也要清除定时器,然后在执行定时器。

// An highlighted blocksetTimer: function () {this.timer = setInterval(() => {this.gtePack();//定时器执行的任务clearInterval(this.timer);//清除定时器this.setTimer();//重启定时器}, 10000);},
 

这样我们的内存就稳定了,页面开多久都不会出现每面很卡的现象。
当然,我们渲染页面的时候我们也要注意:
在这里插入图片描述
我们再渲染数据视图的时候,我们先要销毁实例然后再进行渲染,比如:

// An highlighted blockif(this.myChart){ //判断视图是否渲染this.myChart.dispose();  //如果渲染了  先销毁this.myChart = undefined; //把视图容器变为undefined}
 this.myChart = echarts.init(this.$refs.allMap);  //在进行视图的绑定!
 

通过这种方式,我打开页面测试了一下,我写的可视化大数据页面,有9个echarts视图表格,发现内存很稳定,没有了持续升高的迹象。


标签:

上一篇: DatePicker控件显示具体的时分秒 下一篇:
素材巴巴 Copyright © 2013-2021 http://www.sucaibaba.com/. Some Rights Reserved. 备案号:备案中。