Open Source Saga at Mozilla
I wanted to code like professionals and write the best software. That motivated me towards open source and being aware of the “Mozilla” keyword as a browser, I chose to dive in there. Mainly on Taskcluster and out of curiosity, other projects FireFox Devtools, FixMe etc.
I’m grateful to Dustin and team for valuing my contributions at Taskcluster and inviting me to Mozilla’s All Hands 2018, Orlando.
I‘m writing about this after way too long. So I find it slightly hard to recall and go into detailed architectures.
Some Related Tags
- React
- NodeJS
- GraphQL
- Go
- Python
- Testing
- Documenting
Taskcluster
Taskcluster is Mozilla’s internal CI and task execution framework. Stating directly from the official documentation:
What does Taskcluster do ?
Fundamentally, it executes tasks. A task is defined in a JSON object, and placed on a queue. A worker later claims that task, executes it, and updates the task with the results.
What is Taskcluster ?
Taskcluster is a set of microservices exposing a REST API, together with a convenient user interface and a set of workers that are responsible for executing tasks. A deployment of Taskcluster consists of running services associated workers (or configuration to start workers on-demand).
It was damn overwhelming since hacking anything required so much understanding of the entire ecosystem.
My first few contributions were on json-e. Json-e takes a json template and a json context and produces a json output. It comprises several operators. With support in node, go and python.
Eg for $map and $each operator
template:
$map: [2, 4, 6]
$each(x): {$eval: 'x + a'}
context: {a: 1}
result: [3, 5, 7];It seemed like a wild ride. Whatever got me curious I dived in, hacking on multiple parts: taskcluster-hooks, taskcluster-notify, taskcluster pulse and tc web , json-e, taskcluster-worker etc.
Taskcluster Pulse is the communication bus for the microservices. It has a pub sub system using RabbitMQ and amqp protocol.
Taskcluster-Hooks is a hooks service which creates tasks in response to events (cron job, webhooks, api call, pulse message)
Taskcluster-Notify is a notification service for task updates via email, irc, pulse and (now even slack, matrix)
FireFox Devtools
I wish I had time to do more here. I had just scratched some molecules, not even the surface.
Inspector Tools
Unless you dive into the very details of CSS one may find it weird. Inactive Css is a new feature which warns you when you use some css property which cannot effect due to the absence/presence of some other property. Kudos to @violasong this is her baby as she says.
At the time of writing this article, FireFox is the only browser which supports inactive-css.
I added specifically the inactive display property on floated element thing. Major part of the browser code in hosted in mercurial at https://hg.mozilla.org
My bugzilla profile. Note: Not every issue is captured here.
Firefox Profiler
This tool visualizes performance data recorded from web browsers. It is a tool designed to consume performance profiles from the Gecko Profiler but can visualize data from any profiler able to output in JSON. The interface is a web application built using React and Redux and runs entirely client-side.
Mozilla develops this tool to help make Firefox silky smooth and fast for millions of its users, and to help make sites and apps faster across the web.
So this was a feature I added in the profiler Sometimes when someone sends me a profiler link, I get confused because the top pane doesn't show the interesting threads. It's a pain especially on Mac, which doesn't show a scrollbar unless I actually scroll down.