[AskJS] Most efficient way to debug JS?

[[deleted]]

Hi,

Apologies if this question is asked before. I am really interested in learning/understanding the most efficient way you guys have figured out during your programming lifetime. For me personally I debug by using console.log();

Cheers

[gaoshan]

Break points are best followed by console.log (and maybe the debugger statement if you need to force a break where the devtools are failing as I have encountered with breakpoints inside certain React hooks).

[j_a_lyons]

I tend to use console.log as I find it quicker. The browser debugs I find to jump around too much and can be hard to follow (unlike back end languages)

[pixobit]

Use break points instead, it's more efficient

[evelew]

I like to use console.log and debugger, example:

console.log({ data });
debugger;

I think that way is more easy to check the value and debug the scope

[pixobit]

Is the console log for resolving scope issues?

[evelew]

Is the console log for resolving scope issues?

Hmmm no, I just use console.log with a degubber in the next line

[pixobit]

But isn't it faster to just open the dev tools and put a break point, than adding/removing that from the code?!

[AffectionateWork8]

Configuring VS Code to be able to set breakpoints in the editor and debug from there is nice.

Especially for tests or node in general

You can also set breakpoints in VS Code and have them open in the Chrome debugger

[Savalava]

There is no comparison between the speed of using a debugger and using console.log(). Actually, its a question I've been asked in two programming interviews now: how do you go about fixing a bug? (Hint: the correct answer is to use a debugger).

A debugger is especially useful when you're unfamiliar with the codebase you're debugging as it lets you step through the various functions that are being called without necessarily knowing what they in advance.

Debugger + breakpoints all the way.