I use Chrome or Firefox built in developer tools, however I still think Firebug fits my workflow the best. Unfortunately it's too slow to use.
The thing I miss the most is the inline display of AJAX call responses, and being able to write/run multi-line snippets of JavaScript (without ctrl+enter).
Somewhat interestingly, Firefox built their entire add-on architecture because Joe Hewitt wanted dev tools (for debugging the actual browser moreso than websites), and Firebug was split off from Firefox and made into an add-on. A decade later, this has reversed and every major browser now ships with integrated dev tools.
"too slow to use" -- it now uses JSD2, which is much faster. So you may want to give a try again, as your previous experience may no longer be valid on this point.
I read that Firebug 2 now uses the newer JSDBG2 API of recent Firefox, so there should be no performance problems as there were with Firebug 1.x in recent Firefox versions.
I hate the fact that the close window/dialog button for the devtools is on the left hand side when every other plugin puts this on the right hand side. I am not an every day user of FF's built in devtools so it is not something that I am accustomed to. Despite firebug's performance troubles when I go to select devtools or firebug I usually opt for firebug simply because the close button drives me nuts.
We moved the button and a number of the tabs in Firefox devtools to be more like the order in Firebug and Chrome devtools. Here's a screenshot from current Nightly: https://i.imgur.com/EmVIZYO.png
New devtools are much improved however would it be possible to remove the dotted lines whilst inspecting an element (toggled option would be fine), just seems to get in the way of things.
I hate that I have to use both. If I right click and inspect element on your username, and then search for 'gkoberger', firefox shows zero matches because it doesn't search attributes. At the time of this posting, chrome finds four matches. It's little stuff like that which drives me crazy.
> The thing I miss the most is the inline display of AJAX call responses
If I understood correctly, you can have this on Chrome. In Chrome JS Console, do a right click in an empty space, and select "Log XMLHTTPRequests" (or it was something similar).
I have the enabled, however it only shows the URL accessed.
To see the actual response, you have to click the URL, which takes you to the Network panel. Then you have to find the request on the Network panel (no clue why it doesn't deep link to the correct tab), then click Response.
Shamelessly hijacking your comment to ask a question....is there any way (Chrome/Firebug, whatever) to somehow output to console or a log, all javascript execution (ie: as any function is executed, output the function name and the argument values). I know there is some way to turn on debugging and breakpoints, but having very little expertise in javascript and no knowledge of the code I'm looking at, the ability to just dump all activity so I could sift through it later would be tremendously useful.
that works but still not as good as firebug's UI. basically you then need to click on the log entry, it will take you to the network panel and then you need to do another click to view the actual data. firebug has it all there in JSON decoded form and HTML its more convenient and requires a single click.
And for Firefox Developer Tools, we have the Scratchpad. I like ours better due to the keyboard shortcuts for eval/display/inspect/re-eval function/etc, but I may be biased ;)
The thing I miss the most is the inline display of AJAX call responses, and being able to write/run multi-line snippets of JavaScript (without ctrl+enter).
Somewhat interestingly, Firefox built their entire add-on architecture because Joe Hewitt wanted dev tools (for debugging the actual browser moreso than websites), and Firebug was split off from Firefox and made into an add-on. A decade later, this has reversed and every major browser now ships with integrated dev tools.