小程序种使用echarts闪退问题

今天在发开小程序中,发现在ios设备中使用一段时间后自动闪退,安卓设备会十分的卡顿。使用小程序的真机调试可以看到使用一段时间后,小程序的内存占用十分的高,最多达到1.5g然后就闪退了,应该是内存占用过多导致微信直接把他杀掉了。

原因

每一个图例在没有数据的时候它会创建一个定时器去渲染气泡,页面切换后,echarts图例是销毁了,但是这个echarts的实例还在内存当中,同时它的气泡渲染定时器还在运行。这就导致Echarts占用CPU高,导致浏览器卡顿,当数据量比较大时甚至浏览器崩溃。

解决方法

在小程序销毁的时候把echart的实例也销毁掉

1
2
3
detached(){
chart.dispose() // 组件实例被从页面节点树移除时销毁echarts实例
},

参考:vue + Echarts 填坑记(Echarts数据量大,导致浏览器卡顿)