Btukfyl

I have a web app using javascript websockets to fetch and render realtime data.The problem is once the websocket connection is established,the memory usage of my browser gradually increases in MBs.
Once I close the tab,the memory usage drops by the same amount as it increased.
I am rendering the data received through websockets to google chart as well and the data is received every 2 seconds triggering a re-render of the chart with new data.Could that be the issue?Or are websockets causing the rise in memory usage?

There's no way we can have any concrete idea what is causing this problem without knowing a lot more about your app and seeing your code and probably instrumenting it as described below.

It's not a generic problem with webSockets. webSockets can be open and receiving data for years without causing memory to increase.

These problems are solved by methods like these:

1. Code inspection (find a place where data is accumulated indefinitely)


2. Finding articles about people having similar problems and looking at their solutions to see if they apply to you


3. Instruction to take heap snapshots, comparing them with previous ones and seeing what kind of objects are accumulating and then using that knowledge to find the source of the data accumulation.

See How to Record Heap Snapshots in Chrome for a very detailed description of doing memory use debugging. There's not really anything more specific than that we can tell you based on the limit info we have on your specific case.

You could probably eliminate webSockets from the equation entirely by not connecting your webSocket and then just simulate getting data from the webSocket by running setInterval() and rerendering your chart over and over. That might at least eliminate some of your code as a suspect.

FYI, here are a couple other articles to look at:

Memory leak using google charts with ajax

Memory leak in google line charts

Quick tips for squeezing memory leaks out of Google's Javascript charts with live (continuous) data/streams

Profiling memory usage in Chrome

I figured out the problem.
Thanks @jFriend00 for the guidance.

I assumed the problem to be with websocket after some lazy reading of blogs/posts/articles and posted the question here after that.

I re-checked my code and found that the issue was with re-rendering charts every second.I was creating a new instance of the chart for rendering every second.I was hoping GC would do the job of clearing up the old chart but it wasn't so.

I modified my code to clear the existing chart and render the same with new data and Voila! my memory consumption is back to normal.