Comments (7)
应该会自动垃圾回收吧,能麻烦给个示例么
from vue-tree.
代码里面的examples实例我修改了以下Performance页面,点击 生成大数据 然后渲染树形后,切换到别的页面没有树形的页面,内存一直没变化
from vue-tree.
handleBigTree(){
const data = [],
root = 3,
children = 1,
base = 800000;
for (let i = 0; i < root; i++) {
data.push({
id: `${i}`,
title: `test-${i}`,
children: [],
});
for (let j = 0; j < children; j++) {
data[i].children.push({
id: `${i}-${j}`,
title: `test-${i}-${j}`,
children: [],
});
for (let k = 0; k < base; k++) {
data[i].children[j].children.push({
id: `${i}-${j}-${k}`,
title: `test-${i}-${j}-${k}`,
});
}
}
}
cache = data
}
from vue-tree.
from vue-tree.
折腾了一番,感觉是 Vue 切换 component is 的问题,因为 Performance 页面包含了个原生的 select ,所以内存没法被释放。
做了个不含树组件的仓库来复现(Vue3):https://github.com/ChuChencheng/vue-memory-leak
记得要把 Vue.js devtools 关了,貌似这个也会有影响。
2023-06-07.04.00.55.mov
同时在本项目的 2.x 分支(Vue2) Example 中做了类似的改动,有同样的问题。
具体是什么问题,得看 Vue 源码了,毕竟官网明确写了切换 component 会卸载之前的组件。
官方 issue 里也有一些类似的问题还没解决的样子。
from vue-tree.
我通过在Tree.vue 文件中的销毁方法中手动添加了销毁,解决了内存没变化的问题。由于我TS不熟,手动赋值null,导致与上面定义的类型不一致,该文件中需要所有涉及到的地方添加非空断言!,作者大大看一下有没有别的好的写法。
from vue-tree.
缓解了内存占用的情况
Vue2 版本 @wsfe/ctree
v2.3.1
Vue2/3 通用版本 @wsfe/vue-tree
v3.0.3
from vue-tree.
Related Issues (20)
- 提个优化项。this.$refs.tree.setCheckedKeys HOT 2
- ie11 堆栈溢出 HOT 4
- 组件不错,名字不好,不利于检索,可以改一下 HOT 5
- key-field prop not working HOT 1
- 多选的时候,子级不全选,选部分,怎么能取到父级的半选中状态数据 HOT 3
- 如何自定义节点的渲染内容 HOT 2
- 求助
- vue-cli新创建的项目咋集成不进来呢 HOT 9
- 鼠标右键时间,获取不到事件对象 HOT 1
- 大佬请教一下,修改其中一个数据的状态,怎么触发试图更新 HOT 1
- 优化建议
- vue 2 项目使用的时候编译报错 HOT 4
- 加载十万条数据的时候,勾选根节点会卡住,内存和cpu都爆满,有解决方案吗 HOT 1
- 我希望勾选的时候父勾选,子节点都勾选,子节点取消勾选,父不变 HOT 1
- 我有3000个节点,全部取消勾选瞬间就取消了,但是全部勾选要等一下才能勾上,为什么?? HOT 1
- 这个为啥没报错
- TreeDrop单选时报错 HOT 1
- 懒加载的箭头问题 HOT 1
- 下拉树数据量大会存在内存泄漏 HOT 1
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from vue-tree.