🐛 [BUG] changeData 存在内存泄露

[XuXu-free]

🐛 Bug description [Please make everyone to understand it]

使用组件实时更新数据时，发现内存占用逐渐增大，排查问题后发现启用 g2 绘图并更新数据后会出现此现象，根据网络上的解决方案使用 destroy 后依然无法解决

数据更新的频率较高，百毫秒内

输入 data 格式如下：

组件代码如下：

<script setup>
import { onMounted, watch, onUpdated, onUnmounted, ref } from 'vue'
import { Chart } from '@antv/g2'

const props = defineProps(['data', 'title', 'index'])

const sleep = (delay) => new Promise((resolve) => setTimeout(resolve, delay))

let chart
onMounted(() => {
  console.log("init")
  chart = new Chart({
    autoFit: true,
    height: 300
  });
  chart
    .data(props.data)
    .encode('x', 'time')
    .encode('y', 'val')
    .encode('color', 'name')
    .scale('x', {
      type: 'time',
    })
    .scale('y', {
      domain: [0, 1000],
      nice: true,
    })
    .axis('y', {
      title: props.title,
      titleFontSize: 12,
      labelOpacity: 0.8,
      grid: true,
      gridStrokeOpacity: 0.5,
      labelFormatter: (d) => d,
      labelAlign: 'parallel'
    })
    .axis('x', {
      title: null,
      labelOpacity: 0.8,
      titleFontSize: 12,
      labelAutoRotate: true,
      grid: true,
      gridStrokeOpacity: 0.5,
      labelAlign: 'horizontal'
    })

  chart
    .line()
    .encode('size', 2)
    .encode('shape', 'smooth')
    .animate('update', { type: false })
    .legend('color');
  chart.render()
  const container = chart.getContainer(); // 获得挂载的容器
  document.getElementById('container' + props.index).appendChild(container);
})

onUnmounted(() => {
  chart.destroy()
})


watch(() => props.data, (val) => {
  console.log(val)
  chart
    .scale('x', {
      domain: [val[0].time, val[0].time + 20000],
      mask: 'mm:ss.SSS ',
      type: 'time',
      range: [0, 1],
    })
    .scale('y', {
      domain: [0, Math.ceil(Math.max.apply(Math, val.map(item => { return item.val })) / 10 + 1) * 10],
      nice: true,
    })
    .axis('y', {
      title: props.title,
      titleFontSize: 12,
      labelOpacity: 0.8,
      grid: true,
      gridStrokeOpacity: 0.5,
      labelFormatter: (d) => d,
      labelAlign: 'parallel'
    })
    .changeData(val);
}, { deep: true })

</script>


<template>
  <div>
    <div :id="'container' + props.index"></div>
  </div>
</template>

现象：内存占用随时间增长，中间的下降是因为将缓存的数据清除后出现，但整体呈现增长无法停止

再运行一段时间后

• G2Plot Version: "@antv/g2": "^5.2.1"
• Platform: Win11