on Jan 21st, 2007Debugging Ajax with Firebug

I just cannot live without firebug nowadays, its become more a default than an added utility and I have done my part of suggesting it to atleast a 100 people I know. I found this article by Joe Hewitt through Ajaxian, which details out what you can do with Firebug.

I shall make a small list of the things described.

- Exploring objects : all the DOM and the XHR’s are always been kept track of even after the page has finished loading so you can explore a wealth of those nitty gritty things that used to drive you up the wall before.

- Mouse over structure highlighting – moving your mouse over a html element wil highlight the element on the page. Great utility when you are thinking of things like HTML debugging or even DOM placements.

- Edit with ease- you can edit almost anything in Firebug and can view changes in place than having to run back to your Editor to do so.

- XHR is the best : all XHR request URLs and their replies and content are sniffed out. Debugging these things were a pain in the behind, when I started ajax development. Wish i had Firebug that time.

- Logging : Firebug is not just a way for you to examine a page from the outside; it is also a place for you to send messages from within the page itself. To facilitate this, Firebug provides every web page loaded in Firefox with the console object that contains a number of functions for logging. As your script executes, you can fill the console with an ongoing stream of data for you to analyze.

- Addign breakpoints : You can add breakpoints in Firebug to your script and break on to check individual values and variables at each state. This has got to be one of the most amazing  features of firebug. You can also select an option , break on error, to stop further execution the page when a error occurs.

All in all firebug is a tool which any webdeveloper should know of. If you havent already got, then please do so.

Trackback URI | Comments RSS

Leave a Reply