Hacker News new | past | comments | ask | show | jobs | submit login
Developer Tools in Firefox 11 - 3D DOM Inspector and Live Style Editor (browserfame.com)
95 points by twapi on March 14, 2012 | hide | past | favorite | 27 comments



To all the `insightful` comments that again talk about browser speed on a story about Mozilla, lets just remember that different teams under the same organization work on different aspects of the same product. So if the effort is good, lets praise its goodness before criticizing other aspects of the product that may be worse compared to competitors.

It is lovely to see a good effort in the developer tools that were quite abandoned and that other products on the same space were evolving at good speed, like the chrome dev tools, which I find a great tool to work with day after day.

Lets see what Mozilla can do with the javascript part, they should be able to create at least the same good experience as the chrome dev tools do. At least I hope so...


I thought this was going to be over-the-top, but after watching the video, there are cases where the 3D could actually be useful. Granted, I use Chrome's Developer tools and don't see myself switching back to FF anytime soon, but I still laud their innovation.


The saving of style sheet changes seems useful, but thats it from my point of view.


They seem to be focusing 100% on making dom/css editing pretty but forgetting all about javascript and requests/headers etc. What gives? While this 3D dom stuff looks neat, doesn't make me want to switch from Chrome at all because it's not going to add anything to my day job which does involve DOM/CSS, but also heaps of javascript as well.


Well, the Firefox dev tools team also shipped the new Web Console and JavaScript Scratchpad in recent releases [1] and has been improving them rapidly. They've already landed much of the back-end code for the new JS debugger protocol [2] which will eventually culminate in a complete new debugger including features like remote debugging of Firefox for Android. They've also been working with the Firebug team on improved stability and other enhancements.

Today's announcement for Firefox 11 is just about the stuff that happened to ship during the most recent six-week release cycle. It doesn't mean that the team isn't working on lots of other projects [3].

[1] https://hacks.mozilla.org/2011/11/developer-tools-in-firefox...

[2] https://wiki.mozilla.org/DevTools/Features/Debugger

[3] https://wiki.mozilla.org/DevTools/Features


Woah there, they aren't finished with their development tools. They aren't forgetting anything. They just aren't finished yet. And it's not like Firebug suddenly doesn't work anymore.

For example, you have the scratchpad, the error console, and the web console.

This is a bit older, but I see the reason they aren't trying to replace Firebug is that their is no immediate need to. They can explore do things that Firebug isn't doing.

http://blog.mozilla.com/devtools/2011/05/25/the-relationship...


Really 3D? I don't even...


I for one think it totally makes sense to visualize in three dimensions that which really does work in three dimension but shows only the top level.


Doing things right / Doing the right things.

They're doing the wrong things here. Firefox is dog slow compared to Chrome.

Firefox: I loved you for a few years, but now I fondly remember Firefox 3.5 as "It was better than I.E" ... my new love is Chrome, because Chrome is at my doorstep asking where can it take me, while you're still getting out of bed in the morning.


Firefox shouldn’t be massively slower than Chrome for day-to-day use. The usual advice here: turn off extensions that you’re not actively using. If it’s still slow then you could consider making a new profile, which usually speeds stuff up.

http://support.mozilla.org/en-US/kb/Managing-profiles


I never understand people who say Firefox is as fast as Chrome. It's nowhere close, and can't be.

My normal use case is to open 15 tabs, all at once, from a single page (e.g. Hacker News homepage).

Firefox is single-threaded, as far as I know, and the whole interface freezes while it does the heavy lifting in loading the contents for each new tab. It takes me 30 seconds total of waiting 2-3 seconds for each tab to load, just so I can scroll/click on a new link.

Whereas with Chrome, I just breeze through clicking on all the links, it takes 5 seconds total, and every other tab starts loading on separate threads. I can switch to the loaded ones instantly.

This has nothing to do with extensions, and everything to do with the fact that Chrome has a separate UI thread and separate threads per-tab.

Please correct me if anything I'm saying is wrong...


Firefox is single process (mostly – some plugins run in separate processes), but multi-threaded. There's one thread for the main UI, but as much work as possible is done asynchronously off of that thread.

Browsers are very complex software and there is a lot that goes into browser performance.

http://www.tomshardware.com/reviews/chrome-17-firefox-10-ubu...


I just tried your experiment on Chrome and yep, it was faster than Firefox, but by no means was Firefox slow. Sure, the UI slowed down a touch for the few seconds it took to load the pages (framerate dropped while I scrolled up and down) but it wasn’t unusable and I definitely didn’t have to wait 30 seconds - didn’t have to wait at all.

Maybe I’ve just got a decent-spec machine here at work (quad i5, 12gb ram)…


I use a 2010 MBA (with SSD). Not super-fast, but not ancient either.

I would love to be able to scroll while other tabs were starting their loading!


That should be easily fast enough. If you don’t care about your Firefox profile but want to try Firefox again occasionally then I’d just blow it away and create a fresh one. It lives in ~/Library/Application Support/Firefox.

By the way, sorry you’re being downvoted. You’re adding to the conversation, not trolling.


Firefox is not single-threaded.

Firefox is multi-threaded but single process.


"During 2011, we saw the latest Firefox release that year being up to 7 times faster than Firefox 3.6!"

"A lot of work went into this area, and there were improvements resulting in up to 50% less memory usage."

Source(https://hacks.mozilla.org/2012/03/firefox-in-2011-firefox-pl...)

Personally I don't get the whole fast/slow argument it seems people bring up every time a web browser is mentioned. They all seem to perform comparably. I use firefox only because it allows me to group and hide my ~80 tabs and only loads the ones i'm using.


Same here, but I still can't get away with NOT using Firefox but only due to Firebug. I just can't get to grips with chrome's dev tools, but it may be a habit thing. And Firebug for Chrome is just "Lite" really.


Is there any particular functionality you're missing? Chrome Dev Tools are really comparable in my opinion. I would like a way to tamper data sent in POST, but I don't think even Firebug has that built in.


It's those minor but intuitive things that we get used to when using firebug. For example: 1) The inspect tool is at the bottom on chrome dev tools. It would have been much more intuitive to keep it at the top of the bar.

2) You don't see a change of cursor when hovering over editable properties. People who never used firebug might have gotten used to this but for me it feels clunky.

3) No single click edit. On firebug you can start editing a property with a single click. Not so on chrome. This is even worse when editing styles. When single clicking a style you don't even see a visual indication that something happened... again feels clunky..

4)Too many tabs that are not bunched according to how often they are used.. I don't think people use Resources, Timeline, Profiles, Audits as often as they use the other tabs.

5) The information is presented in more readable way. When a break point is hit, chrome displays a bunch of tabs on right which are vertical (often empty - because they aren't relevant to this break point) and wasting precious vertical space..

6) Clutter, clutter and more clutter.. just too many sub windows cramped into one another affecting readability...

I know that most of these reasons are subjective and vary across developers but wanted make a list of my own reasons as I found my self trying to use chrome dev tools and always jumping back to firebug.


The tiny little detail that drives me nuts is that, in Chrome, to disable a CSS rule, the checkbox is on the right side of the rule, not the left.

The problem is that I can't visually tell which checkboxes match which rules, because they're too far away. Even worse, the checkboxes only show up on hover, and disappear when you hover just one pixel to the right of them, because the hover area is set wrong. (At least on OSX.)

It's just all the little details the Firebug gets right, and Chrome doesn't seem to, but day after day, they add up.


You might want to check out Chrome Canary. The checkbox has been moved to the left, and there are several other improvements as well.


Yes, this is pretty much it. I think it's more a habits thing than anything and I will have to force myself (at some point) to jump ship completely unless I see some improvement from FF. I understand Firebug, I just need to be able to fully map those onto Chrome, so need to spend a few hours re-learning.

Only other thing I need/want is the FireQuery plugin to help with any jQuery development.


Thanks for the post. Glad to hear Chrome is coming with a few fixes for those annoyances according to your respondents.

I can only comment on 4), in that I use both Resources and Audits frequently. Resources more-so, I'm always clearing site-specific cookies/sessions. Audits is useful when trying to improve site speed, it has a lot of good advice.


Single click edit has been added to Chrome dev tools


Mozilla is working on performance, and shipping improvements in every release. Here are pointers to some of the performance improvements in Firefox 11: https://autonome.wordpress.com/2012/03/14/firefox-11-is-smal...

Check out https://wiki.mozilla.org/Performance/Snappy for more details...


This echoes my feelings too.

For me FF's developer tool is better, and the add-on ecosystem is better. But it is so so slow.




Guidelines | FAQ | Lists | API | Security | Legal | Apply to YC | Contact

Search: