memory leak with MenuTab component #1496
Description
Components inside a MenuTabItem can cause a memory leak if any of the props of the component change often. This is problematic for plugins that make use of the MenuTab.
Whatever value is set as a prop is stored in memory. Even when the value of the prop changes, the old value is retained in memory too. So if the prop value changes constantly, all the previous values are still stored in memory too. This will cause the memory usage to rise and rise and rise until it runs out of memory and aborts or crashes.
When the component is not inside a MenuTabItem the old prop values are not stored in memory, thus there is no leak. That means the problem lies within the MenuTab and MenuTabItem components.
Expected Behavior
There should not be a memory leak.
Current Behavior
There is a memory leak.
Steps to Reproduce (for bugs)
I'm not able to provide a live demo or code at present but please reach out to me if necessary. In the meantime, steps to reproduce are as follows:
- Create a new component with a
prop. It's easier to replicate if yourpropis an array with many values, but it works with strings too. - Include that new component as a
MenuTabItemwithin aMenuTab. - Set up a method/loop/timer to change the value of the
prop. - Check your memory usage in the dev tools, it will rise until it eventually crashes with an OOM error.
- Place the component outside of the
MenuTabhierarchy and repeat the test. - The memory usage will remain constant, or may rise slightly but will go back down when the GC runs.
Context
It is inhibiting my work creating plugins as I have to try to make a clone of the MenuTab component sans memory leak. If my component inside the MenuTab remains open for long enough, it'll crash with an OOM error because the prop value continually changes. If I isolate it outside of a MenuTab the memory usage remains low and static.
Your Environment
- Version used:
developand 2.6.2 - Operating System and version: macOS 10.14.6