1分钟快速排查内存泄漏

内存泄漏的原因

是指程序中己动态分配的堆内存由于某种原因未释放或无法释放,那么为什么没有释放呢(1.根据JS的垃圾回收机制，当内存中引用的次数为0的时候内存才会被回收 , 2.从根部出发触及到的对象被标记为不再使用才会被释放）

内存泄漏的几种情况

• 全局变量：全局变量引用、变量未申明
• 闭包：内层函数的变量对外层函数内的变量存在引用，闭包未得到释放，可能会导致内存泄漏
• 事件监听未移除：重复监听
• 缓存：缓存未清除导致，所以设置个缓存最大值

如何避免？

• Eslint检测非期望的全局变量
• 尽量少写复杂闭包
• 绑定时间在Destroy的时候记得清除

如何解决？

heapdump打快照，memory看内存快照

泄漏前，泄漏中，通过Delta对比对象变化

闭包导致的案例

        function Foo(){
            var stage = []
            setInterval(() => {
                debugger
                this.data = {
                    name: 'wbczxxxxxxxxxxxxxxxxxx',
                    hobby: {
                        phone: '11'
                    },
                }
                stage.push(this.data)
            });
        }
        const foo = new Foo()复制代码

如果你还不能确认是闭包导致的问题，通过调试工具右下角可以发现形成了闭包

打快照发现，Js Arrays对象内存明显上升

又通过Delta发现，array数组下的对象的个数在递增，通过对象的key值，可以定位到具体代码，进而定位到由于闭包引起对外层变量的引用，内存未释放

另外如果是浏览器里可以通过Performance也可以查看内存堆随时间的变化

作者：饿了么新餐饮前端团队
原文链接：https://juejin.cn/post/6844904005764644878