JavaScript debugging tips | Hacker News Reader

JavaScript debugging tips

berzniz.com

58 pointsberzniz16 comments

IMHO, the title should be "5 JavaScript debugging tips you’ll start using today in Chrome".

Maybe the first tip should have been "use Chrome".

I've used Firebug and Firefox tools, but they don't add much. Firefox has a nice 3D feature that only helps "WOW" your friends.

Chrome is the only real tool today for developing and debugging web-apps.

Yes, Chrome for development all day. When I was using Firefox Firebug was a good tool but Chrome dev tools are just too nicely implemented, IMO.

I remember the first time I showed my coworkers 3D mode :')

I think this depends on what version of FF you are using. The devtools in Nightly at least have really come a long way. Two very handy features I use that Chrome doesn't have is blackboxing[0] and Shader debugging[1]

[0]: https://developer.mozilla.org/en-US/docs/Tools/Debugger#Blac...

[1]: https://hacks.mozilla.org/2013/11/live-editing-webgl-shaders...

I'm firmly in the Chrome camp.

At work we have some proxy that needs extra software installed to work transparently. Without it you need to explicitly configure applications to use it.

Group policy takes care of most of this (setting the machine proxy and configuring IE's Internet Options dialog. IE and Chrome and most other apps work just fine but for some goddamn reason Firefox has its own proxy configuration settings and no matter how carefully I configure them it just doesn't work.

Chrome seems to be pretty popular from the "it just works" limited privileges installation and automatic updating point of view, and the "good developer tools" point of view.

We inherited a web application where the developers appeared to have used Chrome exclusively. The development was so Chrome-centric to the point where our support people ask customers if they're using Chrome or not when logging issues. If they're not using Chrome they're asked to try installing it (this is just an informal process that's developed organically).

I feel this is a shame, I want our customers to be able to use whichever browser they choose.

Firefox has a nice tool that switches between viewport dimensions. That is about all I can say for Firefox in a web development capacity. Their dev tools are really bad, unfortunately.

I think most of this can be done also with the new firefox console. At least in the nightly version.

Worth noting that the chrome emulator now properly renders the correct pixel ratio making it significantly more useful.

I had to update Chrome to get the Emulate feature. Awesome feature!

Agreed. I had no idea about the emulate feature until just now. This is life changing (at least as far as my work-life is concerned).

Emacs and skewer-mode. Demo here: http://www.youtube.com/watch?v=4tyTgyzUJqM&feature=youtu.be

Didn't know about Audit. Very useful. Thanks.

I'm in the Chrome camp, but for the times that I've used Opera's Dragonfly thingy, I've gotten value from it. The only thing that used to suck about it was requiring an Internet connection. A few years ago when I was in varsity Internet was a luxury outside campus.

debugger is a nice keyword, although I've noticed it slipping into committed code (at work) more and more frequently. Our code review process catches it most of the time, but it's noise in the source control system (another commit to remove it).

Doesn't make it any less valuable, and a stray debugger; statement doesn't cause any problems out in production.

The last three were new to me. Emulating mobile layouts will save a heap of time, currently I use Electric Plum's simulators (which are good, but another tool to set up).

JShint would catch that.

Related, more good tips: https://plus.google.com/+MarkBennettCa/posts/N1qwzwuAZd1

Reply on news.ycombinator.com