Firediff is a Firebug extension that tracks changes to a pages DOM and CSS.

Change Tracking

Change Tracking Screenshot

Firediff implements a change monitor that records all of the changes made by firebug and the application itself to CSS and the DOM. This provides insight into the functionality of the application as well as provide a record of the changes that were required to debug and tweak the page’s display.

In addition to monitoring each change, Firediff also allows individual changes or sets of changes to be reverted, while leaving other changes intact.


DOM Snapshot

Also implemented within Firediff is a series of features that allow for a developer or designer to easily import their changes made in Firebug back into the source for their site or application. These features include the snapshot UI and save snapshot as well as the save diff functionality.

Through these collective snapshot features, the developer or designer can easily visualize and save all of the changes that have been made to the page, be it the current page state or any change in between.


Firediff 1.1 requires Firebug 1.6 and Firefox 3.6.


The latest release of Firediff is available here.


For those who wish to contribute, the source code is available on googlecode within the Firebug project under the diff tree. The current release is maintained in the firediff1.0 branch.

Issues may be reported to the fbug issue tracker.