After proclaiming very publicly that I loved HttpFox and everyone Related Posts
should have it there were many comments regarding Firebug, including some that came via e-mail. I've used Firebug in the past, but hadn't really looked at it in comparison to HttpFox and thought that with so many people saying it was "all that and more" with regards to HttpFox, I should take a second look and compare.

Folks are definitely right about Firebug being everything HttpFox is and then some. Like HttpFox you can easily launch Firebug from a status bar icon.Unlike HttpFox, Firebug needs to be launched on a per-tab/window basis; HttpFox stays open as an overlay even when switching tabs. That does provide some nice ease of use in that you can simply switch from page to page and continue monitoring.
HttpFox: The Firefox add-on you can't live without

A Billion More Laughs: The JavaScript hack that acts like an XML attack

HTTP: The de facto application transport protocol of the Web

Working around client-side limitations on custom HTTP headers

firebug1The drawback to this is that just like Wireshark, the protocol layer traces of requests and responses are intermixed. Firebug will only show you the requests/responses/data applicable to the page you are currently viewing. Again, this is a mixed bag of goodness - it certainly helps for debugging and viewing specific pages, but you have to relaunch Firebug every time you want to view a page and in admittedly limited cases where you're debugging specific interactions with a site, you have to "repost/reget" the data, which could be problematic when you're trying to recreate a specific problem for debugging purposes or you run into while testing, especially if multiple tabs/windows are involved. In this respect, HttpFox appears to be a better choice as you can start it and it will continue to monitor the flow across tabs, windows, and requests without interruption.

Also slightly annoying is that the capturing of network layer data requires you to start the Net monitoring for the page separately. HttpFox automatically captures this data as part of the analysis process. On the flip side, Firebug does a much better job of visually representing the time to load individual components in a page, with HttpFox presenting the load times in a fashion similar to Wireshark, i.e. text based only.

Where Firebug really appears to shine is in its ability to dig into content. In addition to being able to view headers, cookies, query strings, and post content, Firebug lets you dig into the DOM, Javascript functions, stylesheets, and even Flash objects. If it's an object on the page, you can dive in as deep as you want and in a format that makes sense. Not only do you see the requests in nearly raw form, you can see them formatted as they would be in the page. HttpFox displays content, but it's not separated out by type nor does it provide a visual mechanism for viewing the source or traversing through a DOM.

HttpFox: Elegance through simplicity Firebug: Making the complex visually appealing
httpfox4 firebug2

CONCLUSION

If you need to be able to dig into layout issues, into Javascript problems, or traverse the DOM, then Firebug is definitely the way to go. If you're looking for a simple but elegant tool for tracking requests and associated protocol layer information, then HttpFox will more than adequately serve your needs. Both offer the basics and do so well.

HttpFox beats Firebug in its own UI design, in the way it easily lays out protocol layer information and associates them with requests, but it can't compare to Firebug's ability to dig deeply into content.

For me, I'm sticking with HttpFox because it suits my needs. But I definitely see the value of Firebug, and the next time I need a tool for debugging content issues, I'll certainly start-up Firebug instead.

Follow me on Twitter View Lori's profile on SlideShare AddThis Feed Button Bookmark and Share