Build Firefox Faster with Artifact Builds

By  on  

Working on Firefox DevTools has always been a dream of mine, mostly because it feels like the ultimate way to give back to the development community and those that helped me become a success.  And when I explain who Mozilla is and people ask "Oh, so you work on Firefox?!", I can finally say "yes"!

Of course working on Firefox DevTools isn't without its problems, the biggest being that Firefox takes forever to build.  And its effect on a MacBook Pro's CPU?  Well...here's a recent photo of me building Firefox:

Build Firefox

Thankfully there's a faster way to build Firefox for local developer:  artifact builds.  Artifact builds allow you to use pre-built binaries to build Firefox for debugging DevTools (and other features) much more quickly.

Start by creating a mozconfig with the following contents:

# Automatically download and use compiled C++ components:
ac_add_options --enable-artifact-builds

# Write build artifacts to:
mk_add_options MOZ_OBJDIR=./objdir-frontend

The trigger a build using mach:

./mach clobber && ./mach build

# Use `./mach build faster` in the future

Firefox builds go from an hour (and potentially a call to the Fire Department) to just a few minutes.  If you're looking to help develop DevTools, Firefox, or simply have your own custom build of Firefox, jump on artifact builds -- these mozconfig directives are worth the time!

Recent Features

  • By
    Responsive and Infinitely Scalable JS Animations

    Back in late 2012 it was not easy to find open source projects using requestAnimationFrame() - this is the hook that allows Javascript code to synchronize with a web browser's native paint loop. Animations using this method can run at 60 fps and deliver fantastic...

  • By
    Write Better JavaScript with Promises

    You've probably heard the talk around the water cooler about how promises are the future. All of the cool kids are using them, but you don't see what makes them so special. Can't you just use a callback? What's the big deal? In this article, we'll...

Incredible Demos

Discussion

    Wrap your code in <pre class="{language}"></pre> tags, link to a GitHub gist, JSFiddle fiddle, or CodePen pen to embed!