10 Tips for Javascript Debugging Like a PRO with Console

Tip #1 console.trace()

 

If you want to know where the log is being prompted from use console.trace() to get the stack trace with the logged data.

 

 

Tip #2 console.time() && console.timeEnd()

 

If you are trying to find a sneaky performance issue, start counting time with console.time() and print with console.timeEnd().

 

 

Tip #3 console.memory

 

If your performance issue is even trickier, and you are looking for a sneaky memory leak, you might like to try and utilize console.memory (property, not a function) to check out your heap size status.

 

 

Tip #4 console.profile(‘profileName’) & console.profileEnd(‘profileName’)

 

This is not standard, but is widely supported. You can start and end a browser performance tool - performance profile from the code using console.profile(‘profileName’) and then console.profileEnd(‘profileName’). This will help you profile EXACTLY what you want, and prevents you from having to be mouse-click, timing dependent.

 

Tip #5 console.count(“STUFF I COUNT”)

 

In a case of recurring function or code, you can use console.count(‘?’) to keep count of how many times your code is read.

 

 

Tip #6 console.assert(false, “Log me!”)

 

Yes, conditional logging without wrapping your logs with if-else :)

You can use console.assert(condition, msg) to log something when the condition is falsy.

*disclaimer — in Node.js this will throw Assertion Error!

 

 

Tip #7 console.group(‘group’) & console.groupEnd(‘group’)

 

After writing so many logs, you might want to organize them. A small and useful tool for that is the console.group() & console.groupEnd(). Using console group, your console logs are grouped together, while each grouping creates another level in the hierarchy. Calling groupEnd reduces one.

 

 

Tip #8 String substitutions

 

When logging, you can incorporate variables using string substitutions. These references should be types (%s = string, %i = integer, %o = object, %f = float).

 

 

Tip #9 console.clear()

 

Well, having written so many logs, it’s now time to clear your console a little.

 

 

Tip #10 console.table()

 

Saving the best for last, this is a true gem in my opinion! You can actually print a very nice table with the objects you log using the console.table()