render函数和mount() 函数，在挂载的元素在文档流中移除后，没有正确释放。
Vue version
3.4.0-alpha.4
Link to minimal reproduction
Steps to reproduce
- 创建一个元素
- 在此元素上 使用 render&h 或 defineComponent&mount 挂载一些元素
- 移除这个元素
- 重复1-3
- 打开内存快照，查找 Detached HTMLDivElement 。发现此项只增不减。
What is expected?
在被挂载的元素移除后，释放dom的引用和内存。
What is actually happening?
在被挂载的元素移除后，无法释放dom的引用和内存。
System Info
No response
Any additional comments?
No response
没复现出来啊。Collect Garbage 后，DOM 节点会被回收。
His meaning is that I used a certain component in the template. Afterward, I manually obtained this element, removed the element, and the instance of the corresponding component will not be destroyed. This is as expected because Vue does not monitor the removal of DOM. Therefore, the component instance will not be destroyed.
@edison1105 我这能复现的
我在mapbox的popup的setHTML方法中append一个元素，然后用render再挂载一个到popup的元素上，popup remove时，被挂载的元素没有释放，我在mapbox也提了issue了，人家让我找vue😂https://github.com/mapbox/mapbox-gl-js/issues/12954
你提供的 reproduction 是不能复现的。 能提供一个不带 mapbox 的复现吗？
你是否期望得到一下效果？在dom移除后卸载dom所渲染的组件实例，但是你只执行了 dom.remove() ，这不会使组件卸载，您应该在移除dom的同时，卸载组件实例，你可以尝试一下方式：
let unmount
let count = 0
function renderApp() {
unmount?.()
const el = document.createElement("div")
document.body.appendChild(el)
const app = createApp(TestComponentsBox, { id: 'foo', innerHTML: 'hello' + ++count })
app.mount(el)
unmount = () => {
// 卸载app
app.unmount()
// 移除dom
el.remove()
}
}
如 @Alfred-Skyblue 所说，你需要先卸载 Vue app 再移除 DOM 元素，这并非 Vue 的问题。