igniteui-angular
igniteui-angular copied to clipboard
IgxGrid: memory leak
Description
IgxGrid instances do not seem to get properly garbage collected.
- igniteui-angular version: 14.0.x
- browser: tested in Chrome
Steps to reproduce
- Open this sample
- Click on the 'toggle' button
- Open Chrome Dev Tools -> Memory tab -> Take heap snapshot
- Filter the snapshot by "IgxGrid.."
Result
An instance of the IgxGridComponent remains. Toggling multiple times and taking another snapshot shows as many instances stored as the times toggled.
Expected result
The IgxGridComponent to be garbage collected.
Attachments

Any news on this issue?
This is a side effect of how ngIf handles destroying the content under the hood. It actually tries to be smart about it to be able to recreate it more quickly which leads to perpetual left-overs. This happens with any content inside really, it's not igxGrid-specific.
Check the sample I am attaching. I replaced igxGrid with a very simple Material table. There is still a reproducible leak, albeit smaller (mostly due to Material table being a simpler grid implementation with a lot less code than igxGrid). To help make it more noticeable I added a button to start/stop a toggle loop. igx-grid-memory-leak-14.zip
I reviewed your sample and it does not shows a leak
When the table is visible I get an instance after taking a heap snapshot in chrome developer tools.

When the table is hidden (ngIf with false condition), I do not get an instance of MatTable, demonstrating there is no leak

Here is a new sample that does not use *ngIf : I used the angular router to add and remove the igx-grid component: https://github.com/wizgob/igx-grid-leak-2
Reproduction steps (in google chrome)
- run ng serve on the project above and load it in chrome
- Click on 'grid' link : igx-grid i showed
- Click on 'home' link : igx-grid is hidden
- Open chrome developer tools, go to 'Memory' tab, take a heap snapshot
Expected behaviour: No instance of IgxGridComponent is found in heap snapshot
Actual behaviour: An instance of IgxGridComponent is found in heap snapshot : there is a memory leak. Each 'home'/'grid'/'home' cycle results in another instance being leaked.

Any news on this problem?
We'll be assigning it for further investigation most likely very early in November, after the current cycle of development is complete.
Generally speaking, Angular makes memory leak hunting a lot harder as it has quite a lot going on under the hood that's essentially blackbox . In many ways Angular routing is not that much different from how ngIf functions so it may have the same drawbacks as well. But we'll surely investigate it to be certain. I can just say that the last time we had a suspected memory leak in a different component it turned out to be ngIf's doing and during my initial research I did go over a list of suspicious (I use the term loosely as they were only suspicious if you expect Angular to cheat in some way) event handlers (those are almost always the culprit for GC to not do its thing) and swapping them with double and tripple safeguards did little to change the result.
There has been no recent activity and this issue has been marked inactive.