views:

1323

answers:

8

I need to learn either Firebug or IE Developer Tools in a hurry, and I could use some advice about which one is better. I'll be using either one to debug some JavaScript, primarily with repsect to an XHR mystery. Any tips about which one to choose would likely save me lots of time and would be most appreciated.

EDIT: I already use Fiddler and love it.

EDIT: I aim to support all browsers.

+6  A: 

I would suggest Firebug first, as, it will help you determine errors more quickly, as I found it more intuitive to use, but, if you are only supporting IE then the IE Developer tools would be your best bet.

Which browsers do you support?

That will determine the best one to start with, but, if you have to, use Firebug for the initial debugging.

James Black
Thanks. I aim to support all browsers.
Slack
+19  A: 

I would suggest starting with Firebug because it traditionally has provided the most powerful set of debugging features.

However IE dev tools (and others such as Opera Dragonfly) are rapidly catching up and are probably preferred if your pages are being displayed primarily in those browsers.

So I don't think you can get away with just learning one or the other. Find out which browsers your users prefer and install the developer tools for each browser.

You'll save yourself a lot of time solving obscure browser specific Javascript or DOM bugs using the debugging platform specific to that browser.

Ash
+2  A: 

You'll definitely feel at home with Firebug. I is the easiest and the most powerful of tools that I know of for debugging pages live. I constantly make use of it prior to committing a change to a CSS stylesheet (i.e. margins/paddings, colors and the like). The fact that it also includes a Javascript Debugger and a console is a plus. From what I gather, many that do not use Firefox use Firebug Lite. It's JavaScript powered and a bit slow, though.

IE8 Dev. Tools is useful, but the experience isn't very much alike Firebug, but the concept remains. I recommend also familiarizing yourself with Safari Web Inspector and Opera Dragonfly. They are debugging tools with similar aspects to Firebug.

Furutsuzeru
Why learn much about Opera since it has such a small market share, and doesn't appear to be growing much? If supporting mobile devices then Safari can make sense, but it also has a small market share, depending on what the target browsers are.
James Black
Well, to be fair, he did state that he wanted to 'support all browsers', and I thought recommending Dragonfly was at least relevant.
Furutsuzeru
Opera isn't very common on computers (except in Europe), but there's a lot of Opera on mobile devices, and the Nintendo Wii's browser is Opera. Again, it depends on your target audience. If they'll all be using desktop or laptop computers in the US or Asia, then IE, Firefox, Chrome, and Safari will cover almost all cases. Otherwise, I'd add Opera to the mix.
David Thornley
+4  A: 

Learn both, at least if you are pro web coder. There's not much to learn anyway - it's just a tool.

Ondra Žižka
+1  A: 

Unless it's to test/debug and IE quirk with JS, you are better off sticking with Firebug. IE8 DT doesn't even come close to Firebug in performance or usability. Try IE8 DT and debugging JS while you are running a project in VS's debugger. I'll save you the trouble and tell you "YOU CAN'T". Develop with Firefox as your standard and 99% of everything else will work fine.

HapiDjus
Really IE8 Developer Tools are garbage, laughably slow on any modestly complex page.
dolzenko
A: 

I think you will have to learn both, because sometimes things that work in FF don't work as expected in IE, or the other way round, so it will be helpful to use the tool that matches the browser.

ammoQ
A: 

As stated already, the answer is to learn both. As goes with cross-browser development, time must be spent to work out the kinks in different browsers. Firebug is by far the superior tool, but if you're troubleshooting a bug in IE, it goes without saying that the IE Dev tool would be the better choice.

Also, since we are still coding for multiple versions of IE. IE 7 compatibility mode is a nice feature to test that you're latest changes that seem to work fine in IE8 are still working/looking like you would expect them to in IE7.

jaywon
+1  A: 

The development tools in Firefox and IE are same now after the arrival of IE8. Yeah, it do mean that Internet Explorer is still not the choice of developers due to many reasons, however the basic tool of FF famous in developers is Firebug and another is Web Developer Toolbar, well IE Developer Tools cover both of them and if you are familiar with IE Developer Tools or Firebug on FF, you shouldn't have any problem to work on the other browser.

This tutorial is useful: Tutorial: Using IE Developer Tools as Firebug in Mozilla Firefox

Hammad Tariq