icon_bespin_m

Extending Firebug for Better Debugging

One of the most useful tools ever created for debugging html/javascript/css is Firebug. If you are a web developer or web technical support person, you are doing yourself a disservice if you don’t use it. It provides the most complete suite of debugging tools available for Firefox . When combined with the tools of the “Web Developer” plugin by Chris Pederick, you can tackle just about any problem.

One of the great things about Firebug is the pluggable format that allows other developers to add features and functionality to firebug. I use two firebug addons that provide their own unique value, and have nice integration points within firebug.
The first, is YSLOW, by Yahoo. It analyzes your pages, and provides performance statistics as well as recommendations on how you can make your page/site load faster. I have been using YSLOW for about a year, and it is a great way to benchmark pages and page elements.

firescope
The newest addon that I am just now trying out is Firescope codeburner by Sitepoint. It provides context menus, and a search interface that provide you reference information on html elements, attributes and css properties. So you can tell within one panel whether the changes you are planning to make on a css element will work in IE7, or Firefox, or Opera. I am still getting used to integrating into my workflow, but thus far it seems like a great tool.

I suggest you try not only Firebug, but try extending the functionality and hence the value of an already great plugin, by installing these other addons.

 

One thought on “Extending Firebug for Better Debugging

Leave a Reply