vue2+ echarts 运行时间太长导致内存溢出
- 使用定时器setInterval 每个15秒请求后端数据,渲染页面,但是时间一长的时候,chorme浏览器发生奔溃,原因是内存的溢出。
解决方式1
- 就是在重新init的时候,销毁之前的echarts实例,可用clear()和dispose()手动清理变量,区别是clear()不会销毁实例,只是重新绘制图形,而dispose()会销毁实例,需要重新构建ECharts对象
var chart
if (chart) {
echarts.clear(chart)
chart = echarts.init(document.getElementById(dom))
}
切换tab隐藏显示时,chrome浏览器又一直叠加内存,因此需要监听浏览器标签页的显示和隐藏事件
- 监听visibilitychange事件,页面隐藏时清除定时任务,页面显示时重新开启定时任务
document.addEventListener("visibilitychange", () => {
if (document.hidden) {
// 清除定时任务
} else {
// 开启定时任务 }
});
标签: 内存溢出
版权声明:本站所有图片/内容除标明原创外,均来自网络转载,版权归原作者所有,如果有侵犯到您的权益,请联系本站删除,谢谢!