【记一次】VUE SSR内存泄露解决过程和经验总结
关注公众号 前端人，回复“加群”
添加无广告优质学习群
一次vue项目内存泄露的排查经历。
先上JS内存泄露的几个常见原因
全局变量引起的内存泄漏。 闭包引起的内存泄漏. dom清空或删除时，事件未清除导致的内存泄漏
node方面的内存泄露也基本差不多，
处理过程了解到的VUE方面的内存泄露的原因
计算属性无返回情况下，导致的异常 vue高版本已修复. 引用第三方组件，未在destroy函数进行释放。 事件监听，页面关闭后未解绑事件。
这次内存泄露的主要原因
vue.use() 全局插件安装使用导致的，初步分析是使用域导致的闭包，重复安装插件，未释放的原因
//组件页面A：
function install(Vue){
Vue.directive("k-scroll", {
bind (el, binding, vnode) {
}
});
}
export default {install};
//安装插件页面
import Vue from 'vue';
import A from "./A";
Vue.use(A);
后期修改成：
import Vue from 'vue';
let isinstallKeep = false;
function installKeep() {
if(isinstallKeep) return;
isinstallKeep = true;
Vue.directive("k-scroll", {
bind(el, binding, vnode) {
}
});
}
installKeep();
不用到vue.use()来安装,可解决，主要是在vueSSR的情况，用到vue.use()的地方都要进行排查，修改调整，调整后，服务器内存恢复正常。
node监控平台服务器内存检测图对比
调整前：
一点攀升，因访问量比较小，但内存随着时间一点点堆空间上升直到进程崩溃重启。
调整后：
释放正常，无访问时，内存恢复 正常，平静。
总结
整体原因分享出来，具体遇到问题的伙伴可以一起沟通。记住遇到到问题要请求帮助，自己的思路有限，集大家的解决问题的思路会更快找出问题所在。
原文 https://developer.aliyun.com/article/682846
减少bug的方式
回复 资料包领取我整理的进阶资料包回复 加群，加入前端进阶群console.log("点赞===再看===快乐")Bug离我更远了，快乐离我更近了
评论