After seeing a great talk by Johannes Schlueter about dtrace, I want to pass on the information and give a short introduction on how to set up your (Firefox) JavaScript development environment on OSX so you can dive into dtrace and start exploring the powerful features of this tool.

Building Firefox

it is recommended to build Firefox from a release source and not from trunk since you really want to profile your app in an production environment. You can build Firefox from head though some of the plugins won’t work.

1. Building preconditions

To build firefox you need to make sure that a few modules are installed:

Xcode

If Xcode is not yet installed on your machine get a copy at http://developer.apple.com/technology/xcode.html.

Mac Ports

You need Mac Ports to make installation of the following modules much easier. Get the .dmg here http://www.macports.org/install.php

Packages for building Firefox

The remaining two packages you will need from the ports repository are “libidl” and “autoconf213″
After you have installed Mac ports open a terminal and run

$ sudo port sync
$ sudo port install libidl autoconf213

2. Download Firefox

For this blog article we will download the 3.0.6 release from ftp://ftp.mozilla.org/pub/mozilla.org/firefox/releases/3.0.6/source/ – if you want to profile other firefox releases visit ftp://ftp.mozilla.org/pub/mozilla.org/firefox/releases/ and go to the proper VERSION/source directory.

You can get more useful information on how to download the source from trunk (mercurial) at https://developer.mozilla.org/en/Build_Documentation#Get_the_source

Once you have the source, move it into your home directory, extract it and go into the created “mozilla” directory in a shell.

$ cd ~
$ tar xf firefox-3.0.6-source.tar.bz2
$ cd mozilla

3. Creating a build config

Create a file in your home directory ($ cd ~) with following content and save it under .mozconfig

. $topsrcdir/browser/config/mozconfig
mk_add_options MOZ_OBJDIR=@TOPSRCDIR@/obj-ff
ac_add_options --disable-libxul
ac_add_options --enable-debug --disable-optimize
ac_add_options --enable-shared --disable-static --enable-dtrace
ac_add_options --with-macos-sdk=/Developer/SDKs/MacOSX10.5.sdk
mk_add_options MOZ_MAKE_FLAGS="-s -j4"
mk_add_options AUTOCONF=autoconf213

4. Build Firefox

Make sure you are in the directory of the downloaded firefox source – this should be the “mozilla” directory and run

$ cd mozilla
$ make -f client.mk build

5. Launch the newly build firefox

$ cd obj-ff/dist
$ open MinefieldDebug.app

Testing dtrace

Fortunately dtrace already is installed on OSX 10.5 (My machine is running on 10.5.6).
Open a new shell and open for instance google.com. After the page has loaded switch back to the shell and enter

sudo dtrace -n javascript*:::function-entry'{ @[copyinstr(arg1), copyinstr(arg2)] = count(); }'
    -n END'{ printa("n%-6s %-35s  %5@u", @); }'

(Note that you have to paste the code in one line!)

We are using the “function-entry” probe which will give us the possibility to inspect each function call within the javascript code. This example is fairly simple and is just showing us how many times a function got called.

Now on the Google page open the dropdown of the top menu and close it again.
Back in the shell, terminate dtrace by pressing “CTRL+C” and inspect the output.

It should look similar to this

CPU     ID                    FUNCTION:NAME
  1      2                             :END
 abs                                      1
 autosave_disable_buttons                 1
 autosave_enable_buttons                  1
 autosave_parse_response                  1
 autosave_saved                           1
 autosave_update_preview_link             1
 autosave_update_slug                     1
 blur                                     1
 clearInterval                            1
 complete                                 1
 isNaN                                    1
 open                                     1
 send                                     1
 setInterval                              1
 success                                  1
 getResponseHeader                        2
 j                                        2
 join                                     2
 match                                    2
 parseInt                                 2
 removeChild                              2
 appendChild                              3
 goUpdateGlobalEditMenuItems              3
 goUpdatePlacesCommands                   3
 removeAttribute                          3
 setRequestHeader                         3
 createElement                            4
 toString                                 7
 valueOf                                  7
 substr                                  11
 isCommandEnabled                        12
 concat                                  13
 setTimeout                              15
 substring                               16
 goUpdateCommand                         24
 encodeURIComponent                      26
 getControllerForCommand                 27
 toLowerCase                             27
 getElementsByTagName                    31
 updatePlacesCommand                     36
 goSetCommandEnabled                     60
 setAttribute                            61
 split                                   64
 getElementById                          92
 apply                                  191
 replace                                223
 test                                   268
 exec                                   356
 getAttribute                           359
 toUpperCase                            376
 shift                                  482
 unshift                                546
 call                                   654
 indexOf                                835
 push                                  2329
                                 6251

In the next blog post I will explain how we can write more complex dtrace scripts which give us deeper insight into profiling our applications performance. We merely have covered the tip of the dtrace iceberg so watch out for the next dtrace update.

Thanks Johannes for the great talk!