FireFox + Firebug vs IE8 Developer Toolbar

Quite a while ago, I wrote a note on the release of IE8 with new developer tools that are very similar to the FireFox Firebug plugin. And now, after several months of work with everyone, it's time to share their opinions about them.

First of all - both tools are excellent. If you're doing web development (heavy javascript), do yourself a favor, install both browsers with the right tools. If you are using IE7 - upgrade. If you're using IE6, well, may the gods be merciful to you. Get rid of him. For tests, you can boot an IE6 virtual machine .

I am familiar with .NET developers who simply will not help you if R # is not installed in your environment. The same situation with web developers today. You must have IE8 and Firefox + Firebug.
')
Getting started with both tools is easy. F12 is your best friend and comrade. After clicking we will see the highlighted html code, the ability to fold the code into groups, as well as information about CSS styles.





And in order not to describe for a long time, I present a table of comparisons, including not only IE8 and FireFox:

Funkiya	IE8	FireBug + Firefox	Opera	Safari	Chrome	Need
HTML
Syntax highlighting
Code folding
Edit Html
Validation Html	*
Clearing cache		**	**	**	**
Highlight and Highlight
Markup
CSS
View / Modify CSS
CSS Highlighting
Disable CSS styles
Creating new styles
CSS validation	*
Javascript
JavaScript light
Javascript debugging					***
Breakpoints					***
Step-by-Step Debugging					***
Javascript profiler
Run javascript
Call stack
Local variables
Variable tracking
View Web Services
Intangible
Yslow
Browser mode switching
Floating panel
Color selection		*
Color selection		*
Network Request Monitoring		*

* Using third-party sites
** Available from various places in the app.
*** Technically it is possible, but you hardly want to try

As you can see, some functionality is missing in every tool. YSlow, the Console tab, the Network tab in Firebug provide tremendous opportunities. For missing features, install the Web Developer Toolbar .

For IE8, the fact that you can switch between IE7 and IE8 modes, standard or compatibility mode is huge. Built-in validation Html / CSS IE also does not hurt. But the most prominent are the embedded tools in IE8. Color selection, cache management, contours, pictures. To get these features in Firefox, you need to install the Web Developer Toolbar . To track traffic in IE8, you need to install Fiddler2 . In fact, you should have Fiddler for both browsers.

As for other browsers:

Google Chrome : Yes, it has an item in the “Developers” menu that contains a primitive list of features. Quite a lot is missing, but viewing html, css and JavaScript, debugging JavaScript, changing css on the fly and a few more features are available. In general, Chrome is behind IE8 and FireFox.

Apple Safari: Safari also has developer tools, but they are exactly the same as Chrome, plus a couple of extras. It is obvious, because they use one engine, but damn it, add at least a couple of new icons!

But the trouble is, to see the tools for developers, you have to display the menu bar. Then go to the settings tab Add-ons, put a tick "Show the menu Development in the menu bar." Next, in the Development menu, select “Show Web Inspector”.

I still think that Safari is no better than FireFox or IE8.

Opera : I have some problems with the work of tools in Opera. Perhaps I am guilty myself. But what you get is usable.

Winner

It’s hard not to give FireFox + Firebug a slight advantage in this race, but you shouldn’t forget that IE8 gave developers powerful tools in their hands.