Memory Leak Using Google Charts With Ajax

I'm fairly new to javascript and I'm having trouble finding a memory leak in some code which updates a google chart each second with ajax data. My code (simplified to a small test

Solution 1:

This is a known bug. issue1issue2

Solution 2:

If you are building a new chart for each update (with new google.visualization.SomeChart()) then when you are done with the previous instance, you must call clearChart() on it, otherwise memory will accumulate. Google Charts can't tell that the chart has been garbage collected, and it needs an explicit clearChart() call to unlink event handlers from the DOM.

source: https://github.com/google/google-visualization-issues/issues/1021

Solution 3:

What I notice is that, event listeners are not being removed so elements are not being released from memory.

I suspect this line:

if (this.vals.getNumberOfRows() > this.max) {
    this.vals.removeRow(0);
}

Is there any way to make sure that you are removing all event listeners attached to the row you are removing?

Solution 4:

I had the same issue with memory usage from Google charts. Was able to fix my issue by modifying the clearChart() function in Google code.

Here is the full answer:

Google Chart Constant Redrawing Memory Increase