angular js ui grid memory leak issue

Question

I am working on an application that uses angular js UI grid. But as and when I keep using my application, it keeps adding up to the memory without releasing the dom objects.

I have created a sample application where I am able to recreate the same issue of memory leak. I have kept a button("Open slider") in one div, on click of which I am dynamically loading another div that contains UI grid with some data. There is another button("Close Slider") in the other div, on click of which I am able to hide the UI grid.

Following are the screen shots which we observed while investigating the issue on IE browser:

Screen shot showing memory usage when I click on Open slider button to show up the UI grid

Screen show showing no memory released when I click on Close slider button to hide UI grid

So, as you can see in image 2, that when I close the UI grid div, memory is not being released (as shown in developer options > memory tab). So, Is there any way to release the memory once I unload the UI grid or any other way to remove the de-attached dom objects?

You can find the plunker of above application in the comments section.

Cant post more than 2 links so here is the plunker link : plnkr.co/edit/4mM5ZlZjGPdW8b2ZN2Tk?p=preview — Vaibhav Nampurkar
– Vaibhav Nampurkar, Commented Nov 6, 2015 at 12:54

imbalind · Accepted Answer · 2015-11-11 09:36:17Z

0

I tried your plunker profiling with Chrome Dev Tools and I have to say I found no evidence of memory leaks.

Here you can see I tried performing many opening and closing of the grid and in the end memory got released.

Furthermore I tried another one asking Chrome to perform GC before and after every click and I got this:

Here you can see that after every cycle, when I ask for GC, there is just a little amount of memory not released but it doesn't seem to grow over time.

answered Nov 11, 2015 at 9:36

imbalind

1,1826 silver badges13 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Vaibhav Nampurkar Over a year ago

Can you please run the same test in IE browser ? Chrome handles the GC well compared to IE.

Vaibhav Nampurkar · Accepted Answer · 2017-06-06 11:13:41Z

0

The best way to handle memory management in angular js is to make use of “Controller as” syntax.

Using alias for controllers releases DOM elements from the memory once the controller is unloaded.

answered Jun 6, 2017 at 11:13

Vaibhav Nampurkar

213 bronze badges

Collectives™ on Stack Overflow

angular js ui grid memory leak issue

2 Answers 2

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related