Firefox 16: What’s New and Why it was Pulled

Firefox 16 was released on October 9, 2012. Has it really been six weeks since I reviewed Firefox 15? If you managed to upgrade, you were in the minority; Mozilla pulled the download a day later…

Security Vulnerability Warning

Firefox 16 introduced a security vulnerability which allowed a malicious site to examine your history and extract URLs and parameters. Nasty. No one is known to have exploited the bug, but Mozilla took the unprecedented step of removing version 16.0 from their servers and recommending users downgrade to 15.0.1.

Fortunately, Firefox 16.0.1 was released on October 11. If you’ve not upgraded, stop reading this and do it now!

Back already. Let’s continue…

What’s New in Firefox 16.0.1

Firefox has been evolving at a rapid pace. While there are few obvious changes for Mr and Mrs AverageWebUser, Mozilla has added several great tools and updates for developers.

Prefix-less CSS

Fed up typing -moz prefixes? If you’re not using LESS, Sass, Stylus or another CSS pre-processor, you’ll be pleased to hear that Mozilla is the first vendor consider CSS3 animations, transitions, transforms and gradients stable enough to become un-prefixed:

  • Animation properties: animation, animation-name, animation-duration, animation-delay, animation-timing-function, animation-iteration-count, animation-direction, animation-play-state, animation-fill-mode, @keyframes
  • Transition properties: transition, transition-property, transition-delay, transition-duration, transition-timing-function
  • Transform properties: transform, transform-origin, transform-style, backface-visibility, perspective, perspective-origin
  • Image properties: linear-gradient(), radial-gradient(), repeating-linear-gradient(), repeating-linear-gradient()
  • Unit properties: calc() (one of my personal favorites)

You won’t be able to abandon -moz properties until everyone’s upgraded to version 16+, but I expect the other vendors will follow soon.

Reversed Animations

Until Firefox 16, the only way to reverse an animation was to define a new set of keyframes which operated in the opposite way. Fortunately, the animation-direction property now accepts the following values:

  • normal — the animation should play forward each cycle
  • alternate — the animation reverses direction each cycle and steps are performed backward. Timing functions are also reversed, i.e. ease-in is replaced with ease-out
  • reverse — the animation plays backward each cycle
  • alternate-reverse — the animation plays backward on the first play, then forward on the next

You can also mix directions, e.g.


animation-direction: normal, reverse
animation-direction: alternate, reverse, normal

This update is likely to appear in Webkit shortly.

Developer Toolbar

Firefox 16 provides a new Developer Toolbar (Menu > Web Developer > Developer Toolbar):

Firefox Developer Toolbar

It features links to the inspector, debugger (see below), console (the number of errors are displayed) as well as a command line. Type help for a full list of commands, e.g. edit styles.css 123, console clear, restart etc. Handy for those of us too lazy to reach for the mouse.

A Working JavaScript Debugger

I mentioned the JavaScript debugger in Firefox 15 (Menu > Web Developer > Debugger):

JavaScript debugger

You’ll be pleased to hear Mozilla has fixed the problem where breakpoints were removed on page refresh, which meant you couldn’t analyze start-up code. It works and looks great. I’m not convinced it’s better than Firebug yet, but will evaluate it over the coming weeks.

HTML5 APIs

A couple of new W3C APIs have been implemented in Firefox 16, although they’re primarily of use to mobile developers:

  • Battery Status API: you could, for example, optimize your web application to do less work or make fewer Ajax requests as the battery drains.
  • Vibration API: likely to be used in games and for alerts.

Neither API requires the -moz prefix.

Web App Support

Firefox has received updates in readiness for the Mozilla Marketplace (or AppStore if you prefer, but that’ll cause no end of legal shenanigans with Apple and Amazon). With a little effort, you can turn your website into a commercial App which can be promoted in the Marketplace, installed via Firefox and run offline.

It’s a little early to start planning your business strategy — the Marketplace isn’t available yet — but Mozilla has provided preliminary App documentation on MDN.

Miscellaneous Updates

Here are the other highlights in no particular order…

  • Incremental garbage collection in JavaScript. Rather than halting the browser, garbage collection is split into smaller chunks of work to improve responsiveness.
  • IndexedDB has reached Candidate Recommendation status and has been un-prefixed.
  • Recently-opened files can be viewed in the Scratchpad (Menu > Web Developer > Scratchpad)
  • The about:memory page displays memory usage per tab (wohh, CNet — do you really need 24MB of precious resources!)
  • The Opus Audio Codec is supported by default.
  • VoiceOver support is switched on by default in Mac OSX.
  • Acholi and Kazakh localizations are available.
  • URL highlighting is clearer when using the address bar.
  • Firefox mobile receives a new reader mode option to optimize the appearance of articles.
  • Dozens of bug and security fixes.

Mozilla’s pace of innovation is impressive. If you’ve migrated to another browser, I recommend you re-evaluate Firefox 16. The development tools alone are worth the download.

Free book: Jump Start HTML5 Basics

Grab a free copy of one our latest ebooks! Packed with hints and tips on HTML5's most powerful new features.

  • http://mhamann.com Matt

    In my experience, Firefox is still much slower and resource intensive than Chrome. Google Chrome just seems much snappier all around.

    Granted, I’m still on Firefox 10 ESR, so I’ll re-evaluate once Firefox 17 ESR lands. Maybe they’ve changed quite a bit in terms of performance since I last used it.

    • http://www.optimalworks.net/ Craig Buckler

      There was a definite speed improvement around Firefox 13/14 — you’ll be surprised.

    • http://brianswebdesign.com Brian Temecula

      There’s definitely a performance issue on Ubuntu. What O/S are you using? I haven’t noticed any issues on Mac or Windows.

      • Robbo

        I have performance issues in Chrome and Firefox on Linux Mint. It’s something I have learnt to just deal with. Often with only around 10 tabs open which have been open for a day or more will have chrome total in around 2 gigs of memory used. And that is with all plugins and scripts turned off. When I have one of my own scripts running it will be around 900mb for the tabs using it because something isn’t being cleaned up somewhere (most likely my fault but still..).

      • http://www.optimalworks.net/ Craig Buckler

        As an alternative, have you tried Opera? It generally performs well on all OS platforms.

    • nugent

      I find the performance of both varies depending on plugins and the hardware.

      On my windows 7 netbook chrome is much faster, unless the page has an kind of flash on it. Youtube is a miserable experience in chrome on that machine for the last few months. Firefox is noticeably slower at everything but plays the highest quality youtube and vimeo videos fine.

      On my Macbook Pro it’s the opposite.

  • stefan

    I really don’t understand why Firefox is working hard to unseat firebug by adding in html / javascript tools? Firebug is the only reason I still use the browser while developing, chrome’s tools are ok but I’ve never viewed them as powerful as Firebug’s. You could view it as more choice which is mostly a good thing, but in this case I’m not so sure.

    • http://www.optimalworks.net/ Craig Buckler

      I agree there’s some crossover, but there are features which Firebug doesn’t have, e.g. the RWD designer and command line. I think Firefox does need built-in tools. Mozilla can’t depend on third-party support.

      • Alexander DiMauro

        I thought that I remembered reading somewhere that one of the Firebug developers was hired by Google? That would be another reason for Mozilla not to depend on third-party support and keep charging forward.

        I still use Firefox for development because of the tooling. If they can improve it, all the better. But, for just browsing the Web and basic Web use(email, etc.), Chrome has become my default.

  • Muhammad Saleh

    Actually Firefox memory leakage made me turn to Chrome (I know its fixed now) but I guess they fixed the bug too late for me however I still think that Firefox is more experienced browser

  • http://thesmallbusinesswebsiteguy.com John Sawyer

    I’ve pretty much gotten away from Firefox as Chrome add-ons appear that replace the ones I used to have to use FF for. My experience has been that each successive iteration of FF has been worse than the last for the past year or so. Yes, they keep adding features, but each successive version seems to have something else broken that used to work. Except as a browser compatibility testbed, I’m moved on from FF.

    • http://www.optimalworks.net/ Craig Buckler

      Really? Try it again. If anything, Mozilla appear to be fixing stuff well. And, for what’s it’s worth, I usually find Gecko less quirky than webkit.