

New Performance Tools in Firefox Developer Edition 40 - _jomo
https://hacks.mozilla.org/2015/06/new-performance-tools-in-firefox-developer-edition-40

======
acomjean
I like the firefox tools and use them a lot. They kept getting better and
better but recently seem to have plateaued. I keep running into things on
ocation that make me switch to chrome to debug. I sound a little cranky and
ungrateful, but the firefox dev tools are good and I like the way they're set
up, but when I can't get my breakpoint to stop javascript execution and I have
to switch browsers I get a little sad.

Looking quickly the developer edition seems to fix some other little things
(the return of Labeling margin, padding, border on the box model and the
ability to edit the box model in place).

I'm always a little leery of special editions as it was good to develop on the
browser your deploying to.

~~~
callahad
Developer Edition is a pre-beta version of Firefox (the core code goes from
Nightly -> DevEdition -> Beta -> Release, much like Chrome goes from Canary ->
Dev -> Beta -> Stable). DevEdition also ships with some more minor
customizations to ease development: a separate default profile, buttons in the
toolbar for the Developer Tools, etc.

The plateau you're referring to is probably due to the team's focus this
quarter on building the all new performance tool, making sure all the tools
work with process separation (e10s), and trying to squash bugs around polish
and stability. The next few quarters will likely see a return to pushing on
user-visible features.

We also have an opening for a full-time interaction designer on the DevTools
team. If you dig this stuff, or know someone who does, please consider
applying at [https://careers.mozilla.org/en-
US/position/oLiW0fwJ](https://careers.mozilla.org/en-US/position/oLiW0fwJ)

~~~
CWuestefeld
Is it possible to have side-by-side installs of the current stable release as
well as developer edition?

~~~
callahad
Yep! By default, Developer Edition will use a separate profile called "dev-
edition-default", while all other channels use a profile called "default"

------
mrinterweb
These tools look fantastic. Off topic: the first video showed the use of the
new tools and the improvements of using a web worker. I was reminded of how
little I like the implementation of web workers in regard to needing to call
out to an external script. The implementation would have been much better if
it was possible to treat scripts in the same file as threads. I have seen
hacks/workarounds to toString() functions and inject them into the DOM, but it
is unfortunate that this is required for inline web worker use.

------
eterm
Finally my test page[1] no longer crashes my browser with the dev tools open,
and appears to run the same speed with and without the dev tools open. I don't
know if it's related to these changes but clearly it could be.

[1] [http://rcocks.github.io](http://rcocks.github.io)

Edit: Actually it seems to not happen if I don't go to the "inspector" tab but
go straight to the performance tab. Ah well, shame there seems to be a
lingering issue but I'm happy that I have a workaround now anyway. (It used to
crash hard on the performance tab too.)

~~~
malkia
You are also measuring parseFloat(hdn.value) - but I haven't measured how much
of impact it is.

EDIT - Turns out it takes significant amount of time compared to the rest of
the frame, more on chrome, a bit less on Firefox (but the timing profiles are
very different on the two browsers).

parsing floats is not fast! :) (Many edge cases)

~~~
eterm
Oh I know! I realised that later on when I reviewed the code but I gave up
worrying about demonstrating the speed of DOM access* when it started to crash
my browser! So I've left this version here for posterity.

* I wanted to demo to some people why it's better to write javascript that avoids going back and forth to the DOM all the time.

------
ohitsdom
Seems like the Performance Tools is now on par with Chrome, unless I'm missing
something. These tools are sorely needed for web developers, Nik Molnar's
talk[0] on web performance is a great intro on how to use these in real world
scenarios.

[0] [https://vimeo.com/97415381](https://vimeo.com/97415381)

~~~
callahad
Memory profiling is a big missing piece, but it's in Nightly right now, and
should show up in DevEdition 41 or 42 :)

~~~
mistermann
Will this at all help to help diagnose and maybe even fix why FF eats so much
memory? I keep getting out of memory errors in windows and see FF eating tons
of RAM & Virtual, and have no idea which is causing the errors or how to fix
it.

~~~
jgraham
That sounds very unusual _. Have you got any add ons installed? I suggest
trying a clean profile to see if that helps.

_ Unless you have lots of content open that inherently uses a lot of memory,
or something.

~~~
mistermann
Nope, extensions are fine (as per about:addons-memory)

From sysinternals process explorer I see working set 1.6GB and Virtual Size
2.6GB with ~200 tabs open. Don't understand why the virtual is so big.

------
petval
Will it finally enable us to find an offending tab that is consuming too much
memory or CPU? Or it's just a tool that can be used to build this
functionality? Something like Opera 12 has in opera:cpu.

~~~
jacobolus
I’d love to have some end-user control to throttle tabs’ CPU/memory. In
particular, if I have a background tab open that I haven’t brought to the
front in a few hours (or longer), I pretty much don’t want it to get any CPU
cycles at all until I explicitly look at it again, and usually I also want to
have its open TCP connections closed, etc.

------
EdSharkey
Now I don't need to jump into Chrome to do my frame rate tuning, I just need
to shut off Firebug and plop over into Developer Tools! Huzzay!

~~~
chimeracoder
Out of curiosity, what do you use Firebug for that the regular developer tools
can't handle?

There used to be a huge feature gap between them, but that's been shrinking
for a while, and I thought it had been eliminated altogether.

~~~
pmontra
Firebug still has a better UI. The dev tools seem coming straight from the 90s
(Chrome's ones too) but they feel faster. Advantages and disadvantages in
functionality are mixed, but I end up using Firebug almost all the time.
Unfortunaly I'm on a tablet now, if I were at the computer I'd give you
examples. I wish the teams merge and give us dev tools with a Firebug UI and
all the functionalities of the two tools.

~~~
josefresco
I use Firebug simply because it's what I'm comfortable with and "used to". The
UI, keyboard shortcuts and general expected behavior are what keep me locked
in.

When debugging in Chrome/IE it's always painful to use the developer tools
even though they are very capable.

~~~
greenpizza13
IE's developer tools are very far from capable.

------
gsam
>40

Triple digit version numbers are just going to sound ridiculous. I really hope
someone reigns this back in at some point.

I'm keen to test some of these new features out though. The tools in Firefox
have always been a bit hit and miss for me and I've actually never went out of
my way to use Chrome or Firebug.

