QCheckbox have a memory leaks issue.

[yeyuqh]

What happened?

It’s not just QCheckbox; QRadio, QSpace, and other components also use this approach.

import { defineComponent, h } from 'vue'

 // This kind of implementation in the component creates a global VNode, which will not be collected by GC.
const prefixNode = h('span', { class: 'prefix' }, 'prefix') 

export default defineComponent({
  name: 'ListItem',
  props: ['index'],

  setup(props) {
    return () => (
      h('div', { class: 'item' }, [prefixNode, `Item ${props.index}`])
    )
  },
})

In some cases, this can cause the entire page’s DOM to not be collected by GC.

What did you expect to happen?

import { defineComponent, h } from 'vue'

export default defineComponent({
  name: 'ListItem',
  props: ['index'],

  setup(props) {
	const prefixNode = h('span', { class: 'prefix' }, 'prefix') // I believe it should be placed in the setup function.

    return () => (
      h('div', { class: 'item' }, [prefixNode, `Item ${props.index}`])
    )
  },
})

Reproduction URL

•

How to reproduce?

Clicking the Toggle button multiple times to show/hide it reveals that there are always 500 nodes that cannot be collected by GC.

Flavour

Quasar CLI with Vite (@quasar/cli | @quasar/app-vite)

Areas

Components (quasar)

Platforms/Browsers

Chrome, Safari

Quasar info output

No response

Relevant log output

No response

Additional context

No response

[github-actions]

Hi @yeyuqh! 👋

It looks like you provided an invalid or unsupported reproduction URL.
Do not use any service other than Codepen, jsFiddle, StackBlitz, Codesandbox, and GitHub.
Make sure the URL you provided is correct and reachable. You can test it by visiting it in a private tab, another device, etc.
Please edit your original post above and provide a valid reproduction URL as explained.

Without a proper reproduction, your issue will have to get closed.

Thank you for your collaboration. 👏

[rstoenescu]

Hi,

Thank you for creating this ticket and the reproduction setup!
You are indeed right. Seems like the GC doesn't clean up with those global nodes.

Fix will be available shortly in Quasar v2.16.11