地图上绘制贴地点时内存泄漏问题

[long-day]

使用版本

"@vuemap/vue-amap": "^2.0.5",
"@vuemap/vue-amap-extra": "^2.0.1",
"@vuemap/vue-amap-loca": "^2.0.3",
"vue": "^3.2.37"

问题描述

当使用使用vue3的ref引用数据源对象时，更新此对象会导致内存占用一直增加，无法释放，使用正常的非ref引用数据没有问题. 代码如下：

之前这个数据源更新依靠的是setInterval()定时更新，那时就出现了上述问题，为了定位问题的具体原因，我使用了不同方式(控制变量法(doge))，比较明显的一种方式就是，我将数据源更新由定时改为了手动(通过一个按钮),在不点击按钮时，内存是稳定的，当点击之后，内存开始增加，增加后不会不下降。

解决方案

暂时未找到具体的解决方案，只是将响应式数据改为了静态数据。

[long-day]

还有一个怀疑点在我维护这个队列的方式出现了问题，但是暂时未找到替代方案

[yangyanggu]

在vue里更新全量数组的时候，尽量先使用一个临时数组缓存结果，再把那个临时数组一次性赋值给ref

[yangyanggu]

反正尽量保证更新数据源是时候是一次性更新的，不然会触发很多次watch，容易内存溢出

[long-day]

@yangyanggu 好的，我去试试。(后端搞前端搞得我懵懵的) 但是我之前 用了1s的间隔更新也有内存泄漏问题.....

[yangyanggu]

主要在于那个push，跟更新频率没什么关系所以一定要先生成好数据，然后一次性更新，你可以理解为数据库的批量操作

[long-day]

@yangyanggu 好的，情况好多了，看来push的影响很大。谢谢哥了，难为"大学牲"两天的问题算是初步解决了 ( ~.~ )