A lot is happening these days and I bet you already know about Firefox 4 + Firebug 1.7 releases. You might also seen some of the new features introduced in Firebug 1.7 and so, I won't repeat that.
I'd like to focus on changes related to page load process and script execution in Firefox 4. Apart from many performance improvements script execution changed to be more HTML5 compliant and Firebug is an excellent tool that can be used to analyze & understand what is going on under the hood.
Thanks to Henri Sivonen for his excellent post about Script Execution Changes in Firefox 4 that served as the main source of information for me!
Read more...
Firebug 1.7 (currently beta 1 available) improves API related to Infotips. These Infotips are used in Firebug UI for displaying additional information.
They are similar to tooltips but can provide a richer content (comparing to those in HTML). The content doesn't have to be only a text but any HTML. In fact, the content is usually generated using Domplate.
Let's see how to utilize these Infotips in Firebug extensions.
Infotip in Firebug UI
First, see how infotips actually look like. Since they are implemented in HTML and Firebug uses HTML only for panel content (so far) they appear in panels.
The first image comes from the Script panel. The mouse is hovering over a variable and the infotip shows its value.
The next infotip is displayed within the Net panel. It shows detailed timing info for selected (note the gray background) HTTP request entry.
And the last example shows preview of an image when the user hovers mouse over a CSS property with background URL.
Read more...
