Echarts内存泄漏问题分析

原创
2020/02/24 16:06
阅读数 3.4K

内存泄漏的解决方案

组件销毁的时候释放资源:释放定时器、解除绑定的事件、释放图表实例

对于地图来说,攻击线属于无限循环的动画,基于 requestAnimationFrame 进行实现,若不主动进行释放(this.map.dispose()),则会一直常驻内存并占用cpu资源。 关于 requestAnimationFrame 的自动终止和手动终止,分别参考如下文献:

ngOnChanges(changes: SimpleChanges) {
    if (changes['appMapRender']) {
        this.freeChart();
        this.initChart();
        // code
    }
}
ngOnDestroy() {
    this.freeChart();
}
initChart() {
    this.map = echarts.init(this.elem);
    const resize = this.map.resize;
    $(window).on('resize.map', debounce(resize, 200, false));
    // code
}
freeChart() {
    $(window).off('resize.map');
    this.map && this.map.dispose();
    clearInterval(this.intervalID);
}
展开阅读全文
加载中

作者的其它热门文章

打赏
0
0 收藏
分享
打赏
0 评论
0 收藏
0
分享
返回顶部
顶部