Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Javascript Memory Usage & Debugging in Chrome / Firefox (Minefield)

I am currently developing an application using Google O3D WebGL framework, and this is the first time I am using JavaScript so intensively. The features are only around 20% complete, but already the application on its own starts off by taking up around 160 meg of memory, whilst leaving the application running it consumes around 200kb per second in Chrome, 2meg in FF; as the screen is refreshed. As I am writing this I have left Chrome 9 running and it has just hit 400 meg of memory usage. I am now crapping myself especially with FF's usage, and I am looking for any really good documentation on optimizing JavaScript, preventing memory leaks, anything that will help me tackle this basically. I would also really appreciate any links to awesome tools that will help me. Thanks in advance.

Edit: I have come across Mozilla performance tools but I need something simple to use, preferably with a GUI, or at least a noob friendly guide. Also a lot of those tools are for linux (I am using Win7) or require purchase / are command line only. + I would really like to see something for Chrome :) but I will accept the answer that provides the most usefull information.

Edit: Google Chrome's developer tools only report on 10meg of memory usage, unsure where the rest is coming from.

like image 579
Chris Avatar asked Jan 12 '11 20:01

Chris


People also ask

Can you leak memory using JavaScript?

Memory leaks can and do happen in garbage collected languages such as JavaScript. These can go unnoticed for some time, and eventually they will wreak havoc. For this reason, memory profiling tools are essential for finding memory leaks.

How do I use less memory in JavaScript?

Hence there is no explicit way to allocate or free up memory in JavaScript. Just initializing objects allocates memory for them. When the variable goes out of scope, it is automatically garbage collected(frees up memory taken by that object.)

Can JavaScript access memory?

JavaScript takes care of this for us: It allocates the memory that we will need for the object we created. Using memory is something we do explicitly in our code: Reading and writing to memory is nothing else than reading or writing from or to a variable. This step is handled as well by the JavaScript engine.


2 Answers

Have you had a chance to check out Speed Tracer yet? That should give you more of what you need I think.

With memory usage, you probably want to do a heap profile in the Chrome developer tools under the "Profiles" tab. You can compare multiple heap profiles to get a look at memory usage.

like image 195
Bob Aman Avatar answered Sep 30 '22 15:09

Bob Aman


According to http://blog.chromium.org/2011/05/chrome-developer-tools-put-javascript.html you can actually use the performance.memory window property within your Javascript to check the effect of sections of code on memory usage.

This looks useful to me as interpreting the output of heap snapshots isn't straightforward.

like image 43
monkeyboy Avatar answered Sep 30 '22 15:09

monkeyboy