Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Vue 3.5.6 memory leaks #11956

Open
ftrsoft opened this issue Sep 18, 2024 · 5 comments · May be fixed by #11971
Open

Vue 3.5.6 memory leaks #11956

ftrsoft opened this issue Sep 18, 2024 · 5 comments · May be fixed by #11971

Comments

@ftrsoft
Copy link

ftrsoft commented Sep 18, 2024

Vue version

3.5.6

Link to minimal reproduction

Steps to reproduce

Update prodject to vue 3.5.6

What is expected?

Memory leaks. In 1 hour, memory consumption increased from 200 MB to 500 MB.
When I go back to version 3.5.5, everything becomes normal

What is actually happening?

System Info

No response

Any additional comments?

No response

@aurelsserban
Copy link

aurelsserban commented Sep 18, 2024

I experience the same behavior in my web app, unfortunately I am struggling to reproduce the memory leak using play.vuejs.org playground.

Unfortunately in my case the 3.5.5 version is not fixing the leaks either. I noticed that the 3.4.38 version is okay.

Maybe I am doing something wrong in my code, we have a big webapp using vue intensively and I really struggle to get to the root cause, all I can provide is the following:

  1. The chain of retainers seems to follow the following pattern:
    VueMemoryLeak1
  2. I suspect that somehow the VUE_SSR_SETTERS might be the root cause or something captured by a closure, but I am not sure.

I tried to debug it for about a week now but it seems I was not able to get very far.

I will provide another screenshot from another detached element chain of retainers (basically it seems to be the same 'link/path'):
VueMemoryLeak2

@edison1105
Copy link
Member

@ftrsoft @aurelsserban
Please follow the issue requirement and provide a minimal reproduction.

@yysanf
Copy link

yysanf commented Sep 19, 2024

currentInstance in watch scheduler Scopes
when watch executed in scope like this

const scope = effectScope();
const state = scope.run(() => ref({}));

const CompOne = defineComponent({
  setup() {
   state.value ={name: 'state'}
    scope.run(() => {
      watch(() => state.value.name, () => console.log('Do something'))
    })
    return { state };
  },
});

When components are destroyed, ComponentInstance in state.dep.subs.sub.scheduler Scopes, can not gc.

vue sfc

image

for example:Using pinia-plugin-persist can cause this problem

@edison1105 edison1105 added scope: reactivity ❗ p4-important Priority 4: this fixes bugs that violate documented behavior, or significantly improves perf. and removed can't reproduce ❗ p4-important Priority 4: this fixes bugs that violate documented behavior, or significantly improves perf. labels Sep 19, 2024
@edison1105
Copy link
Member

edison1105 commented Sep 19, 2024

@yysanf
You should scope.stop() first and then log state
I modified the reproduction. see Playground

@edison1105 edison1105 linked a pull request Sep 19, 2024 that will close this issue
@edison1105
Copy link
Member

@ftrsoft @aurelsserban @yysanf
Please use those preview packages to test and confirm whether it resolves your issue.
If not, please provide a minimal reproduction.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging a pull request may close this issue.

4 participants