Mozilla Made the Web Better for Developers in 2017

2017 was a stellar year for Mozilla. We launched the fastest Firefox ever, rebuilt DevTools, saw support for WebAssembly ship in all four major browsers, and launched open-source virtual reality and speech recognition platforms. Our developer relations team also attended more than 60 roadshow events around the world and saw the MDN Web Docs site nearly double its readership.

It’s a tough act to follow, but we hope to continue the pace in 2018. We have a ton of great open-source tech on the horizon, all of which we’ll cover here and over at the Mozilla Hacks blog. Thanks for sticking with us, and for reading our various publications across the web. We couldn’t have accomplished any of it without the support of the worldwide developer community. If you want to get involved in 2018, visit our community site to get started.

Firefox Quantum

Firefox ran on the same engine for more than a decade, and at the beginning of 2017, it showed. The browser needed a boost, and Mozilla engineers gave it one. Working with the Servo project, they rewrote the browser’s engine using new core technologies. The first being Rust, an all-new programming language written to take advantage of the latest multi-core processors. Then there’s Servo, the parallel engine built on Rust. And Stylo (Quantum CSS) to again take advantage of multi-core processors. Put it all together and you get a browser that’s light years ahead of the previous version and can outperform other browsers in certain tasks. It took years, multiple teams of engineers, and more than four million lines of new code.

For an in-depth look at how it all works, take a look at Mozilla engineer Lin Clark’s comprehensive post at Mozilla Hacks.

WebAssembly

Running big, complex apps on the web has always been a developer’s dream. Imagine editing photos, playing in 3D worlds, or editing video right in a browser without any plugins. Unfortunately, the web really wasn’t set up to do any of that. It’s based on simple layout and style languages (HTML/CSS) and JavaScript, which is fantastic, but not optimized like native languages (C++, etc.) During the turn of the century, however, Mozilla engineers thought it could be done. Engineer Alon Zakai wrote an app to translate C++ code into JavaScript and chief researcher and engineer Luke Wagner worked with his team to optimize the results. In the process they created WebAssembly, a new language that’s capable of running big programs like games in browsers nearly as fast as they run natively. By the end of 2017, all the major browsers shipped support for WebAssembly, making the web a speedier and more robust place for everyone.

Wagner wrote an in-depth history of WebAssembly for IEEE Spectrum magazine. In it, he tells the tale of using WebAssembly to run game engines Unity and Unreal in Firefox.

A-Frame and WebVR

Virtual reality on the web has been the future for about 25 years now, but those dreams didn’t become reality until 2017. This year, VR standards and frameworks took a big step forward, making it easier than ever to create VR experiences and share them on a variety of devices, from headsets to smartphones and browsers. Mozilla helped promote two major virtual reality web platforms: A-Frame and WebVR. Now major browsers support the standards, which means developers are free to create immersive experiences that run on almost any computer or device. And, because they’re based on standards, they’re easy to use. In fact, a member of our team created a virtual reality experience in less than a day and wrote about it here.

With the introduction of Firefox Quantum, virtual reality on the web is, well, a reality. Mozilla engineer Salva wrote a wonderful piece for Mozilla Hacks explaining how it all works.

Project Common Voice

Siri, Cortana, Echo, Google Home — virtual assistants are the future. But the voice recognition data they’re built on is mostly proprietary. That’s why Mozilla launched its open speech initiative in 2017, to try to level the playing field. Common Voice is an open-source voice recognition project for everyone. Here’s how it works: Contributors read phrases aloud to the Common Voice website to help the AI learn how to understand spoken language. They can also validate Common Voice transcriptions to ensure the AI is on the right path. All the data is free and available for researchers building voice apps.

Right now the site is in English, but other languages are forthcoming. Mozilla head researcher Sean White wrote a brilliant piece about Common Voice for the main Mozilla blog here. Head over to the Common Voice site to contribute your own voice.

Firefox DevTools

Check out the all-new Mozilla DevTools Playground.

The Firefox DevTools team was also busy in 2017. They rewrote much of the underlying code for DevTools, and created all-new tools for CSS Grid and JavaScript debugging. They’re open source and built on web standards like HTML, CSS, and JavaScript, so developers can contribute, remix, and rebuild the DevTools at will. Debugger.html is currently live on Github and ready for contributions and forks. All our DevTools panels were also completely redesigned to be easier to use, and to look better. They adopted our new streamlined Photon UI that totally transformed the look and feel of FireFox.

We also launched the Mozilla DevTools Playground, an in-depth how-to site for learning CSS Grid and JavaScript debugging. Go check it out, it’s free and open to everyone. Also take a look at Mozilla developer advocate Jen Simmons’ incredible CSS Grid lab to learn more about the layout system.

Developer Roadshows

Mozilla developers toured the world in 2017 to help promote open standards and new technologies, including WebVR, A-Frame, and WebAssembly. They visited more than 60 developer roadshow events worldwide.

Mozilla Developer Network

In 2017, more than 8,000 developers contributed to 80,000 pages of content on the Mozilla Developer Network. Mozilla also teamed with Microsoft, Google, and other industry leaders to greatly expand the scope of MDN web docs. It’s a huge collaboration and one that we all hope will make the web a better place for developers and consumers alike.

So what’s next for Mozilla? We’re going to keep making Firefox faster and more powerful, which means fine-tuning WebAssembly and other core technologies. We hope to help WebVR and A-Frame become standards for rich content on the web. We will continue to champion open-source voice and machine learning projects. In short, we’ll keep working to ensure the web remains open and accessible for everyone.