Memory Leak when refreshing DataTable
Memory Leak when refreshing DataTable
This is my code, I am trying to reload my datatable every 60 second
$interval.cancel($scope.refreshDashboardTimer[index]);
$scope.refreshDashboardTimer[index] = $interval(function(){
$(table.table().node()).find('a.dt-tooltip').tooltip('destroy');
table.clear();
table.rows.add($scope.Data[index].RepairOrders);
table.draw();
}, 60000);
When I open my Chrome Task Manager, I could notice memory increases slowing every time the table reload itself. When I ran a profiler for the page I got this:
This is the 1st snapshot last around 1 minute:
https://s3.amazonaws.com/uploads.hipchat.com/20402/1108067/5z1iHxaUSS21EgZ/upload.png
This is the 2nd snapshot a few minutes after the 1st snapshot, last for about 1 minute:
https://s3.amazonaws.com/uploads.hipchat.com/20402/1108067/DFBExeBKWtKddqI/upload.png
From the graph I could tell the object count & array size keeps increasing for a certain period of time, maybe they are not being properly garbage collected?
The dropdown for those massive array are a whole bunch of "transition array" which does not make any sense to me:
https://s3.amazonaws.com/uploads.hipchat.com/20402/1108067/WAbIumIQdw8R4HF/upload.png
I am sure I unbind all the cell/row event before I clear the table, anyone could help on this issue please?