To celebrate the tenth birthday of Firefox, the Mozilla Corporation has released an updated browser designed with developers in mind. The Firefox Developer Edition provides a multitude of tools useful for the creation and debugging of apps, both desktop and mobile. In addition to the tools already in the consumer version, Mozilla included two new features: Valence and WebIDE.

Why now?

As development tools, languages, apps, IDEs, and other pieces of software have flourished the entire tool-belt used by developers has also become more complex. As with any technology ecosystem the web has also been a hotbed of competing standards, with the W3C, languages, frameworks, and web companies (such as Mozilla, Microsoft, etc.) wrestling for control.

The result has become a sphere of knowledge containing everything from jQuery, Node.js, PHP, ASP, HTML5 and numerous other technologies that must interact meaningfully with numerous browsers on a variety of clients. Keeping ahead of that compatibility is a defenite headache for developers.

“Having a dedicated developer browser means we can tailor the browsing experience to what developers do every day,” says Mozilla’s director of developer tools, Dave Camp. He says that developers should not have to “bounce between different platforms and browsers, which decreases productivity and causes frustration.” Instead, the Firefox Developer Edition is meant to solve this problem by creating a focal point to streamline your development workflow.

Firefox Developer Edition eliminates the need to use different development environments that cause a decrease in productivity. The new browser includes a complete set of tools and does not require downloading additional software. Because Firefox is part of an independent open-source community and not part of a proprietary ecosystem, Mozilla can offer features that other browsers cannot offer, using tools regardless of platform or device.

“For a long time, Firefox didn’t ship any developer tools because the best developer tool out there was an add-on for Firefox called Firebug,” Johnathan Nightingale, VP of Firefox, said in a blog post. “Obviously, over time other browser vendors started investing a great deal in developer tools and it became clear to me that this was an area we needed to be invested in, not just to be competitive in terms of the hearts and minds of those developers but also because we have opinions about some other stuff.”

By and for developers

As it is built for a specific group of expert users, Firefox Developer Edition does not come from a stable version, instead it’s an Aurora release (build 36.0a2). When you start you will immediately notice the dark interface, very common in most popular development environments. All the tools are accessible directly from the Developer Toolbar. Also worth mentioning is that the Firefox Developer Edition uses its own profile by default. As a result, it can be run in parallel with other versions of Firefox.

This edition comes with two new features: WebIDE and Valence.

WebIDE replaces the Manager app and allows for the development, deployment and debugging apps for Firefox OS, using a template or existing code. It is a complete development environment for Web applications.

The latter, formerly known as Firefox Tools Adapter, provides runtime simulation of other browsers and other environments. With Valence, developers can develop and debug apps for Android (Firefox and Chrome), and iOS Safari. By simulating popular and likely devices and environments, Firefox Developer Edition helps developers get a head start debugging and understanding how their app will function for consumers.

The Developer Edition also comes with Test screen sizes to check how your website or web app looks on different screen sizes (Responsive Design View), without changing the size of your browser window; Web-audio editor to examine and work with the Web Audio API in real time to ensure that all audio nodes are connected in the desired manner; Pages Inspector to examine the HTML and CSS of any web page and simply edit the structure and representation of a page; Web Console to show logged information to a website and use the Web console to interact with the web pages JavaScript; JavaScript Debugger to run JavaScript code step by step and examine and change its state to narrow down bugs and analyze; Network Analysis to see all started from your browser network requests, how long they need and details of each request, and style editing to explore and edit a web page linked CSS styles, create new contact or existing CSS stylesheets on any pages.

Firefox Developer Edition is available for download in many languages ​​for Linux (32 and 64 bit), Android, Mac OS X and Windows.

Image credit: Mozilla Corporation, Firefox Developer Edition screenshot