search

ElemeFE / element

A Vue.js 2.0 UI Toolkit for Web
https://element.eleme.io/
MIT License
54.1k stars 14.64k forks source link

[Bug Report] DateTimePicker 日期时间选择器 以组件形式使用，存在内存泄漏（el-input输入也有同样问题） #20167

Open sdtm1016 opened 4 years ago

sdtm1016 commented 4 years ago

Element UI version

2.13.2

OS/Browsers version

chrome浏览器任一版本

Vue version

2.6.11

Reproduction Link

https://github.com/sdtm1016/element-datetime-memoryleak

Steps to reproduce

1：参照简单示例：https://github.com/sdtm1016/element-datetime-memoryleak，运行项目 2：打开 chrome 控制台，切换到Memory标签 3: 点击包含有DateTimePicker的弹窗（有时分秒），选择时间，关闭弹窗，来回多次 4：选中Heap snapshot,点击Take snapshot 5：循环步骤3和4，记录内存占用 6：点击包含有DatePicker的弹窗，选择时间，关闭弹窗，来回多次 7：选中Heap snapshot,点击Take snapshot 8：循环步骤6和7，记录内存占用

What is Expected?

DateTimePicker的弹窗操作后，内存占用正常

What is actually happening?

DateTimePicker的弹窗操作后，内存持续增加，且存在Detached节点未释放 DatePicker正常

sdtm1016 commented 4 years ago

Snipaste_2020-09-11_18-29-25 Snipaste_2020-09-11_17-39-47 Snipaste_2020-09-11_17-40-18

sdtm1016 commented 4 years ago

使用DatePicker 内存使用正常 Snipaste_2020-09-11_18-26-03 Snipaste_2020-09-11_18-26-53

sdtm1016 commented 4 years ago

el-input 也有同样的问题

YimingLucnjs commented 3 years ago

请问这个问题你是怎么解决的啊 @sdtm1016

我这边排查下来，antd-vue, element-plus，以及vue2，vue3原生都存在这个问题，是因为input获取了焦点，导致input游离

最后去尝试js原生写法，依旧能复现这个问题，似乎是浏览器的问题 chromium的issue anguler的相关issue

lvkunpeng commented 2 years ago

请问你现在解决了这个泄露的问题了不

babalrlr commented 1 year ago

@lvkunpeng 使用vue2.7，会销毁原生事件，内存问题会好一点

yuhengshen commented 11 months ago

DatePicker type为date时，内存可正常回收，type包含time时无法回收。相关pr https://github.com/ElemeFE/element/pull/22712

yuhengshen commented 11 months ago

el-input 也有同样的问题

input聚焦无法回收和这个本质上不是一个问题，最后一次聚焦的元素无法回收这是浏览器的特性

liuyingqq123 commented 11 months ago

el-input 也有同样的问题

input聚焦无法回收和这个本质上不是一个问题，最后一次聚焦的元素无法回收这是浏览器的特性

我这测试, 是只要任意一个input有聚焦, 整个组件中的dom都会脱离dom树, 都泄露了.

yuhengshen commented 11 months ago

el-input 也有同样的问题

input聚焦无法回收和这个本质上不是一个问题，最后一次聚焦的元素无法回收这是浏览器的特性

我这测试, 是只要任意一个input有聚焦, 整个组件中的dom都会脱离dom树, 都泄露了.

对啊，所以这个是正常的。DatePicker是确实存在问题