|
|
|
Part of the Firefox Add-ons download hub (+1 other) |
|
|
User Rating: Rated by: |
Very Good (4.1/5) 96 user(s) |
|
|
|
Softpedia Editor's Review for FireBug
|
Lets you explore the far corners of the DOM by keyboard or mouse
Written by Cosmin Anton on November 18th, 2011
Also known as one of the most popular and powerful web development tools, Firebug is a small Firefox extension that gives you total control when it comes to editing, debugging or monitor HTML, CSS or JavaScript on any web page.
Firebug bothers you only when you really need it. The utility is disabled on websites by default but, it can be accessed with a single click from the Firefox status bar. Firebug can be enabled for specific web sites, making it hassle free when you want to browse other web pages without the need of this extension.
When it comes to website editing, Firebug automatically activates the HTML, CSS and DOM tabs as soon as you open it. Keeping the other features disabled helps reduce the extension fingerprint on system resources and also keeps you focused on the important things.
If you are a CSS designer or HTML editor, the default enabled tabs might be the only ones you ever need. Enabling the other panels (JavaScript or Net) is easily done using the drop down menu for each of them.
By default the extension opens as a bar at the bottom of your browser but, you can also use Firebug as a separate window making it very useful when you have two monitors to work with.
Editing and inspecting HTML has never been done so easily. The extension can find deeply buried HTML elements allowing you to edit them on the spot.
Also aimed at CSS designers, Firebug makes available all the information you need about web page styles and gives you the possibility to make changes that will be visible instantly.
Monitoring network activity is another feature available with Firebug. You can quickly find out why your pages are taking too much time to load using the unfolding time bars for each loaded file.
For JavaScript debuggers, Firebug comes with a powerful debugger and profiler that can help you measure and improve your JavaScript performance.
Firebug is probably the only extension you may ever need when it comes to debugging, editing or monitoring HTML, CSS or JavaScript code on any website.
|
FireBug description
|
Here are some key features of "FireBug":
Always at your service:
· Firebug is always just a keystroke away, but it never gets in your way. You can open Firebug in a separate window, or as a bar at the bottom of your browser. Firebug also gives you fine-grained control over which websites you want to enable it for.
Inspect and edit HTML:
· Firebug makes it simple to find HTML elements buried deep in the page. Once you've found what you're looking for, Firebug gives you a wealth of information, and lets you edit the HTML live.
Tweak CSS to perfection:
· Firebug's CSS tabs tell you everything you need to know about the styles in your web pages, and if you don't like what it's telling you, you can make changes and see them take effect instantly.
Visualize CSS metrics:
· When your CSS boxes aren't lining up correctly it can be difficult to understand why. Let Firebug be your eyes and it will measure and illustrate all the offsets, margins, borders, padding, and sizes for you.
Monitor network activity:
· Your pages are taking a long time to load, but why? Did you go crazy and write too much JavaScript? Did you forget to compress your images? Are your ad partner's servers taking a siesta? Firebug breaks it all down for you file-by-file.
Debug and profile JavaScript:
· Firebug includes a powerful JavaScript debugger that lets you pause execution at any time and have look at the state of the world. If your code is a little sluggish, use the JavaScript profiler to measure performance and find bottlenecks fast.
Quickly find errors:
· When things go wrong, Firebug lets you know immediately and gives you detailed and useful information about errors in JavaScript, CSS, and XML.
Explore the DOM:
· The Document Object Model is a great big hierarchy of objects and functions just waiting to be tickled by JavaScript. Firebug helps you find DOM objects quickly and then edit them on the fly.
Execute JavaScript on the fly:
· The command line is one of the oldest tools in the programming toolbox. Firebug gives you a good ol' fashioned command line for JavaScript complete with very modern amenities.
Logging for JavaScript:
· Having a fancy JavaScript debugger is great, but sometimes the fastest way to find bugs is just to dump as much information to the console as you can. Firebug gives you a set of powerful logging functions that help you get answers fast.
Just the way you like it:
· Using Firebug gives a lot of possibilities for web development to your hands. Though you're feeling something is not working as you would like it to? No problem. Firebug offers a lot of options to adjust it to your needs.
Search and you shall find:
· Sometimes you know what you're looking for, but you can't see it in the panel. Using the quick search box in Firebug's toolbar you can search inside Firebug's panels and see the results highlighted as you type.
Requirements:
· Firefox 5.0 - 12
What's New in This Release: [ read full changelog ]
· Trace Styles (issue 2916) – This fresh new feature allows to trace all places which affected specific CSS attribute. This feature is now part of the Computed side panel where every CSS attribute is now expandable
· Extended monitorEventS() API (issue 5406) – it’s possible to specify a group of events that should be monitored.
· Auto Completion for CSS selectors (issue 5421) – Firebug auto-completes IDs or class names when the users creates a new CSS selectors!
· Link between web-font usage and its declaration (issue 5438) – This feature allows to quickly find the place where web-fonts are declared.
|
|