Hi Folks, I have a maybe unusual Question so I start with explaining my situation:
I’m working on an Overwolf App that heavily uses Vue/Vuex and its reactivity.
In Overwolf, you can work with multiple Desktop windows, I think comparable to electron apps.
The App is designed in a way, that each window has it’s own root-app (Vue).
Now I tried to use reactive properties across those windows, keeping the “main” store in one of the windows, and reusing it on other windows.
That works well in general, but there is an issue regarding Memory Leaks.
Let’s consider this setup:
Window A holds the vuex store
Window B accesses that store and uses reactive properties.
This leads to the situation, that Window A holds a reference to the vm within Window B.
Due to the Dep instances used for reactive getters etc.
The Issue here is that when closing Window B, the reference on Window A will never be cleaned up, and with that other References. This causes huge memory leaks.
I know this is a very specific Scenario and Vue is not designed for this.
That’s why I don’t ask for a Solution but would like to understand, how and when Vue is removing those Dep references, and if there is a way to force that (when Window B closes basically).
If needed I might jump into understanding all the code around it, but if anyone has a mental model of this ready to share, that would be great help to evaluate if this is solvable
Thanks for participating in this discussion and have a great day!