Solid devtools created_owners inside s.DEV.hooks.afterCreateOwner is holding reference to createMemo (from Child component) inside a Show that is supposed to be cleaned up.
The leak doesn't happen if chrome extension is connected.
const Parent = () => {
const [value, setValue] = createSignal(1);
return (
<>
<button onClick={() => setValue((prev) => prev + 1)}>Refresh</button>
<br />
<Show when={value()} keyed>
{(_) => {
return <Child />;
}}
</Show>
</>
);
};
const Child = () => {
const allData = createMemo(
() => {
return new Array(1e5 * 100).fill(Math.random());
},
undefined,
{ name: "ALL_DATA" }
);
return <div>{allData()[0]}</div>;
};
Steps to reproduce:
- Download repo: https://github.com/aquaductape/solid-devtools-memory-leak
- Open Memory tab in chrome devtools
- Select "Allocations on Timeline" and then press "Record" icon
- Click Refresh button to fire click
- Keep clicking at least 10 times
- Stop recording on Memory
- Look for "{fn, owned, sources, sourceSlots, cleanups, value, owner, context, pure, name, observers, observerSlots, comparator}" or just search "name" on filter
- You'll find the duplicated memos that is retained by SolidDevtools with name: "ALL_DATA" based on cleanup amount, how much you triggered via click.
Also you can check Chrome Task Manager or devtools Performance Monitor to see JavaScript Memory increase

Solid devtools
created_ownersinside s.DEV.hooks.afterCreateOwner is holding reference to createMemo (from Child component) inside a Show that is supposed to be cleaned up.The leak doesn't happen if chrome extension is connected.
Steps to reproduce:
Also you can check Chrome Task Manager or devtools Performance Monitor to see JavaScript Memory increase
