Vue优化:常见会导致内存泄漏问题及优化
1. 监听在window/body等事件没有解绑
2. 绑在EventBus的事件没有解绑
3. 模块形成的闭包内部变量使用完后没有置成null
4. 使用第三方库创建,没有调用正确的销毁函数
5 . echarts问题:
不要把chart实例赋值在this上。(this对象一直存在不会被回收)
析构掉生成的echarts对象。
//-dom 不存在时不画
if (!this.$refs.barchart) {
return
}
//- 不要重复初始化
let Chart = echarts.getInstanceByDom(this.$refs.barchart)
if (!Chart) {
Chart = echarts.init(this.$refs.barchart, 'light')
}
//-释放echarts对象
beforeDestroy () {
let dcharts = echarts.getInstanceByDom(this.$refs.barchart)
if (dcharts) {
echarts.dispose(dcharts)
}
},
6. keep-alive 的 include 里存的其实是一个 vuex 中的一个数据源(数据源保存的是路由名称),当关闭标签页时,这个数据源中的一项会被移除。这之前,我们在组件里监听到这个数据源的变化,如果此组件对应的路由(这个路由应在 mounted 的时候保存下来)已经不在数据源中了,那就应该销毁此组件。this.$destroy("组件名,es6写法就是class类名") 这一步在新的架构里面已经做了
7. setTimeout setInterval清理 (最好不用)可以使用nextTick代替
8. 数据量多引起的内存占用严重,减少数据, 简化vue实例对象的数据量,减少内存开销
9 . vue是单页面,页面路由切换后,内存未释放
10 . 如果在mounted/created 钩子中使用了$on,需要在beforeDestroy 中做对应解绑($off)处理
11. 如果在mounted/created 钩子中绑定了DOM/BOM 对象中的事件,需要在beforeDestroy 中做对应解绑处理
12. 如果在mounted/created 钩子中使用了第三方库初始化,需要在beforeDestroy 中做对应销毁处理
13. Vue官网讲解避免内存泄露 https://cn.vuejs.org/v2/cookbook/avoiding-memory-leaks.html (我们erp没有 Choices.js库,所以不存在)
14 闭包导致,比如事件处理回调,导致DOM对象和脚本中对象双向引用,这个时常见的泄漏原因
16 js实例 用完 未被清理
17 JavaScript 内存泄露 : 1.意外的全局变量 2.被遗忘的计时器或回调函数 3.脱离 DOM 的引用 4.闭包
Vue优化:常见会导致内存泄漏问题及优化的更多相关文章
- LeakCanary 内存泄漏 监测 性能优化 简介 原理 MD
Markdown版本笔记 我的GitHub首页 我的博客 我的微信 我的邮箱 MyAndroidBlogs baiqiantao baiqiantao bqt20094 baiqiantao@sina ...
- 为什么不取消注册BroadcastReceiver会导致内存泄漏
原始问题是这样 然后扔到了很多Android开发交流群里. 接着产生了很多的见解,我感觉比较靠谱的有以下: 网友对我问题的回答 1.onDestroy被回调代不代表Activity被回收了? 官方是这 ...
- Android 非静态内部类导致内存泄漏原因深入剖析
背景 上周发现蘑菇街IM-Android代码里面.一些地方代码编写不当.存在内存泄漏的问题.在和疯紫交流的过程中.发现加深了一些理解,所以决定写一下分析思路,相互学习. 内存泄漏 一个不会被使用的对象 ...
- objective-c strong导致内存泄漏简单案例
例如: @interface Test:NSObject{ id __strong obj_; } -(void) setObject:(id __strong)obj; @end @implemen ...
- MSDN官方XmlSerializer类导致内存泄漏和性能低
MSDN官方XmlSerializer类使用说明链接: http://msdn.microsoft.com/zh-CN/library/system.xml.serialization.xmlseri ...
- python中循环引用导致内存泄漏小案例
首先定义一个Person类和一个Dog类,然后分别实例化对象p和d,给p对象添加一个pet属性 给d对象添加一个master属性此时Person和Dog的应用计数都为2,当del p 和del d后P ...
- 面试官:小伙子,你给我说一下Java中什么情况会导致内存泄漏呢?
概念 内存泄露:指程序中动态分配内存给一些临时对象,但对象不会被GC回收,它始终占用内存,被分配的对象可达但已无用.即无用对象持续占有内存或无用对象的内存得不到及时释放,从而造成的内存空间浪费. 可达 ...
- 重写hashCode方法,导致内存泄漏
package com.nchu.learn.base.reflect; import org.junit.Test; import java.util.Collection; import java ...
- Android一般什么情况下会导致内存泄漏
资料参考:https://blog.csdn.net/u011479990/article/details/78480091 内存泄漏的原因在于生命周期长的对象持有了生命周期短的对象的引用 内存泄漏形 ...
随机推荐
- Mysql - 关于relay_log_recovery参数的测试
一.概述 官方文档中对relay_log_recovery参数的解释 Enables automatic relay log recovery immediately following server ...
- 【译】Kubernetes监控实践(2):可行监控方案之Prometheus和Sensu
本文介绍两个可行的K8s监控方案:Prometheus和Sensu.两个方案都能全面提供系统级的监控数据,帮助开发人员跟踪K8s关键组件的性能.定位故障.接收预警. 拓展阅读:Kubernetes监控 ...
- React + TypeScript 实现泛型组件
泛型类型 TypeScript 中,类型(interface, type)是可以声明成泛型的,这很常见. interface Props<T> { content: T; } 这表明 Pr ...
- 全文搜索引擎 Elasticsearch
写在前面 最近在学Elasticsearch , 我相信只要是接触过开发的都会听过Elasticsearch或ELK这么一个技术. 主要用来做全文检索或大数据分析等,之前一直处理了解状态. 所以打算系 ...
- Spring 梳理-@Controller
@Controller是一个构造性注解(stereotype),它基于@Component 在自动扫描中,组件扫描器会自动将@Controller申明的类注册为Spring应用上下文的一个bean 可 ...
- 物料导出FreeMaker模板定义
<?xml version="1.0"?><?mso-application progid="Excel.Sheet"?><Wor ...
- 设计模式——统一建模语言UML
目录 一.UML的结构 1.1视图 1.2图 1.3模型元素 二.类图 2.1类与类图 2.2类之间的关系 三.序列图 3.1序列图定义 3.2序列图组成元素与绘制 四.状态图 4.1状态图定义 4. ...
- Java基础学习笔记(三) - 抽象类和接口
一.抽象类 没有方法主体的方法称为抽象方法,包含抽象方法的类就是抽象类. Java中使用 abstract 关键字修饰方法和类,抽象方法只有一个方法名,没有方法体. public abstract c ...
- zui框架配置日期控件只显示年月
zui框架配置日期控件datetimepicker只显示年月 <!DOCTYPE html> <head> <script src="~/Scripts/jqu ...
- Spring MVC学习 ( RESTful)
是一套规则,不同的系统之间(Vue java Python C# PHP)具体四种不同类型的HTTP 请求分别表示四种基本操作(CRUD) GET :查询(R) POST:添加(C) PUT:修改( ...