js造成内存泄漏的几种情况
1、介绍js的垃圾回收机制
js的垃圾回收机制就是为了防止内存泄漏的,内存泄漏的含义就是当已经不需要某块内存时这块内存还存在着,垃圾回收机制就是间歇的不定期的寻找到不再使用的变量,并释放掉它们所指向的内存。所以这里又涉及到变量的生命周期,当一个变量的生命周期结束之后它所指向的内存就应该被释放。JS有两种变量,全局变量和在函数中产生的局部变量。局部变量的生命周期在函数执行过后就结束了,此时便可将它引用的内存释放(即垃圾回收),但全局变量生命周期会持续到浏览器关闭页面。所以当我们过多的使用全局变量的时候也会导致内存泄漏的问题
2、主要存在内存泄漏的问题点
BOM / DOM对象泄漏
scipt中存在对BOM / DOM对象的引用
javaScript对象泄漏
闭包函数导致的泄漏
3、主要关注的代码点
DOM中的addEventLisner 函数及派生的事件监听, 比如Jquery 中的on 函数, vue 组件实例的 $on 函数,第三方库中的初始化函数
BOM对象的事件监听,比如webSocket的监听事件
避免不必要的函数引用
如果是要render函数,避免在html标签中DOM / BOM事件
4、在vue中如何处理内存泄漏的
如果在mounted/created 钩子中绑定了DOM/BOM 对象中的事件,需要在beforeDestroy 中做对应解绑处理
如果在mounted/created 钩子中使用了第三方库初始化,需要在beforeDestroy 中做对应销毁处理
如果组件中使用了定时器,需要在beforeDestroy 中做对应销毁处理
模板中不要使用表达式来绑定到特定的处理函数,这个逻辑应该放在处理函数中
如果在mounted/created 钩子中使用了$on,需要在beforeDestroy 中做对应解绑($off)处理
某些组件在模板中使用 事件绑定可能会出现泄漏,使用$on 替换模板中的绑定
Vue官网讲解避免内存泄露https://cn.vuejs.org/v2/cookbook/avoiding-memory-leaks.html
另外,vue 在IE edge浏览器下,父子组件的场景,子组件依赖父组件的状态,子组件控制父组件状态变化从而反馈给子组件的展示变化,子组件通过v-if模式存在于视图中,父组件通过状态控制子组件的v-if状态变换。子组件控制父组件状态完成子组件数据填充后,父组件切换子组件的v-if状态,子组件占用dom结构被清理。此时,子组件存在时的内存占用未被释放,当父组件再次回切v-if状态时,子组件重新展示,内存飙升,重复几次切换后,内存飙升明显,页面卡顿。
js造成内存泄漏的几种情况的更多相关文章
- Js内存泄漏的几种情况
想解决内存泄露问题,必须知道什么是内存泄露,什么情况下出现内存泄露,才能在遇到问题时,逐个排除.这里只讨论那些不经意间的内存泄露. 一.什么是内存泄露 内存泄露是指一块被分配的内存既不能使用,又不能回 ...
- java内存泄漏的几种情况
转载于http://blog.csdn.net/wtt945482445/article/details/52483944 Java 内存分配策略 Java 程序运行时的内存分配策略有三种,分别是静态 ...
- C++中内存泄漏的几种情况
1. 在类的构造函数和析构函数中没有匹配的调用new和delete函数 两种情况下会出现这种内存泄露:一是在堆里创建了对象占用了内存,但是没有显示地释放对象占用的内存:二是在类的构造函数中动态的分配了 ...
- C++内存泄漏的几种情况
1. 在类的构造函数和析构函数中没有匹配的调用new和delete函数 两种情况下会出现这种内存泄露:一是在堆里创建了对象占用了内存,但是没有显示地释放对象占用的内存:二是在类的构造函数中动态的分配了 ...
- Java内存泄漏的几种可能
Java内存泄漏引起的原因: 内存泄漏是指无用对象(不再使用的对象)持续占有内存或无用对象的内存得不到及时释放,从而造成内存空间的浪费称为内存泄漏. 长生命周期的对象持有短生命周期对象的引用就很可能发 ...
- js内存泄露的几种情况
想解决内存泄露问题,必须知道什么是内存泄露,什么情况下出现内存泄露,才能在遇到问题时,逐个排除.这里只讨论那些不经意间的内存泄露. 一.什么是内存泄露 内存泄露是指一块被分配的内存既不能使用,又不能回 ...
- js的内存泄漏场景、监控以及分析
内存泄漏 Q:什么是内存泄漏? 字面上的意思,申请的内存没有及时回收掉,被泄漏了 Q:为什么会发生内存泄漏? 虽然前端有垃圾回收机制,但当某块无用的内存,却无法被垃圾回收机制认为是垃圾时,也就发生内存 ...
- js中this指向的三种情况
js中this指向的几种情况一.全局作用域或者普通函数自执行中this指向全局对象window,普通函数的自执行会进行预编译,然后预编译this的指向是window //全局作用域 console.l ...
- js内存泄露的几种情况详细探讨
内存泄露是指一块被分配的内存既不能使用,又不能回收,直到浏览器进程结束.在C++中,因为是手动管理内存,内存泄露是经常出现的事情.而现在流行的C#和Java等语言采用了自动垃圾回收方法管理内存,正常使 ...
随机推荐
- 刷题记录:[SUCTF 2019]EasySQL
目录 刷题记录:[SUCTF 2019]EasySQL 一.涉及知识点 1.堆叠注入 2.set sql_mode=PIPES_AS_CONCAT;将||视为字符串的连接操作符而非或运算符 3.没有过 ...
- clion 查看代码 多次查看后如何一步一步回退到最初查看的代码位置
在settings->keymap里面搜索navigate,然后就有蓝色字体的Back.Forward,这个两个有自己对应的快捷键,但是你有可能不能使用这个功能,因为在不同的操作系统里面,有可能 ...
- linux 的 两种磁盘扩容
当LVM分区空间不足的时候,可以进行扩容.主要的扩容方法有两种: 通过空余的磁盘进行扩容,这个方法比较简单,不会对原有数据有影响.将其他LVM分区空间取出一部分给需要扩容的LVM分区.下面就分别具体介 ...
- window 10 打开某个 窗口常用命令
1. ctrl +R ,输入:inetcpl.cpl 2. ctrl +R ,输入:services.msc 3. ctrl +R ,输入:msconfig 安装双系统,设置开机引导 4. ctrl ...
- BUG处理流程图
流程描述: 1. 测试人员发现bug提交给开发. 2. 开发人员判断是否是bug. 3. 如果是bug,进行修改,修改完成后更改bug状态为已解决. 4. 如果不是bug,退回给测试人员并描述退回原因 ...
- easyui datagrid 中序列化后的日期格式化
1.在easyui datagrid 中序列化后的日期显示为:/Date(1433377800000)/ 2.格式化后的显示为: 2015-06-04 08:30:00 3.使用代码如下: 3.1. ...
- Office Online Server2016搭建与部署(在线编辑)
至少需要两台服务器,一台域控制器,一台部署Office Online Server https://docs.microsoft.com/zh-cn/officeonlineserver/office ...
- Kubernetes 集群日志管理 Elasticsearch + fluentd(二十)
目录 一.安装部署 Kubernetes 开发了一个 Elasticsearch 附加组件来实现集群的日志管理.这是一个 Elasticsearch.Fluentd 和 Kibana 的组合.Elas ...
- js时间的一些处理
1.判断是否为同一天 function isSameFay(t) { return new Date(t).toDateString() === new Date().toDateString(); ...
- 本地dev环境,运行时用node模块自动读取并整合文件
const http = require('http'); const fs = require('fs'); const path = require('path'); const glob = r ...