Profiling
Finding and squashing bugs is only half the battle; the other half is identifying and killing performance bottlenecks. Firebug gives you two ways to measure the performance of your scripts and separate the tortoises from the hares.
Traditionally, the most low-tech way to measure performance is to record the time before and after a suspect code block and then log the delta. Firebug gives you a pair of functions, time and timeEnd, which do this:
console.time("loading");
loadWidgets();
console.timeEnd("loading");
This technique works well if you already have an idea where your bottlenecks are, but what if you don't? Firebug includes a JavaScript profiler that gives you detailed reports on the performance of every function called during a given period.
There are two ways to start the profiler. The most direct is to click the Profile button in the toolbar of the Firebug Console tab. While this button is toggled, the profiler is working in the background, recording data about each function call. When you're ready to see a report, click the Profile button again, and you see a report that lists every function that was called, how many times it was called, and different statistics about the aggregate time spent in the function.
The other way to start the profiler is from code. The console object has two functions, profile and profileEnd, which let you create profile reports in between specific blocks of code in your scripts:
console.profile();
loadWidgets();
console.profileEnd
("Loading widgets");
Conclusion
In short, FireBug lets you explore the far corners of the DOM. All the tools you need to poke, prod, and monitor your JavaScript, CSS, HTML and Ajax are brought together into one seamless experience, including a debugger, error console, command line, and a variety of fun inspectors.
