Take the tour ×

I'm running a html5 canvas webpage locally with chrome browser. For debugging purpose I'm using console.log trying to track down object pixel location in the animation which happens 60 frames per second. But the problem is that when I run the webpage it works fine until I open the javascript console and see my location being printed out so fast that the development console just freezes, the page still runs but I can't do anything to debug like switch between different tab in the console etc, I have to close the page and re-launch it and the problem happens again very soon.

I also used the build in tool to perform javascript CPU profile collection to see how much resource it's spending on logging, it turns out to be only 0.01% of run time which obviously shouldn't be the issue, however my guess is that even it's only spending a very small fraction of time to do this the console that's actually busy updating the number on the UI is the reason that freezes the page. (I should mention that I'm still able to interact with the page just fine but I can't do anything with the console even just closing it)

Is this normal on chrome browser? Any fix or suggestions? Thanks

share|improve this question
try running at slower than 60fps while you're debugging? –  gengkev Jul 22 '12 at 18:42
add comment

1 Answer

Yes, I would avoid spamming the console. In my experience you can log a surprisingly large amount of data, for instance an array with tens of thousands of items, but you can't call the log function too often or the development tools will freeze while it's redrawing.

So with the above in mind, I would suggest grouping several of your log calls together in an object or array. For instance, if you have a loop that will run a LOT of times and you have 5-6 log calls inside, group those log calls together by adding the data to an array or an object with well names keys, and log that object at the end of the loop.

If you have to log more than once per 100ms for more than a few seconds, I would suggest grouping the log calls.

share|improve this answer
There are even the console.group family of functions, which can help here. –  pimvdb Jul 21 '12 at 16:51
add comment

Your Answer


