Mozilla Hacks

Compiler Compiler: A Twitch series about working on a JavaScript engine

By Yulia Startsev

Posted on June 18, 2020 in Featured Article, Firefox, and JavaScript

Last week, I finished a three-part pilot for a new twitch stream called Compiler Compiler, which looks at how the JavaScript Specification, ECMA-262, is implemented in SpiderMonkey.

JavaScript …is a programming language. Some people love it, others don’t.  JavaScript might be a bit messy, but it’s easy to get started with. It’s the programming language that taught me how to program and introduced me to the wider world of programming languages. So, it has a special place in my heart. As I taught myself, I realized that other people were probably facing a lot of the same struggles as I was. And really that is what Compiler Compiler is about.

The first bug of the stream was a test failure around increment/decrement. If you want to catch up on the series so far, the pilot episodes have been posted and you can watch those in the playlist here:

Future episodes will be scheduled here with descriptions, in case there is a specific topic you are interested in. Look for blog posts here to wrap up each bug as we go.

What is SpiderMonkey?

SpiderMonkey is the JavaScript engine for Firefox. Along with V8, JSC, and other implementations, it is what makes JavaScript run. Contributing to an engine might be daunting due to the sheer amount of underlying knowledge associated with it.

  • Compilers are well studied, but the materials available to learn about them (such as the Dragon book, and other texts on compilers) are usually oriented to university-setting study — with large dedicated periods of time to understanding and practicing. This dedicated time isn’t available for everyone.
  • SpiderMonkey is written in C++. If you come from an interpreted language, there are a number of tools to learn in order to really get comfortable with it.
  • It is an implementation of the ECMA-262 standard, the standard that defines JavaScript. If you have never read programming language grammars or a standard text, this can be difficult to read.

The Compiler Compiler stream is about making contributing easier. If you are not sure how to get started, this is for you!

The Goals and the Structure

I have two goals for this series. The first, and more important one, is to introduce people to the world of language specification and implementation through SpiderMonkey. The second is to make SpiderMonkey as conformant to the ECMA-262 specification as possible, which luckily is a great framing device for the first goal.

I have organized the stream as a series of segments with repeating elements, every segment consisting of about 5 episodes. A segment will start from the ECMA-262 conformance test suite (Test262) with a test that is failing on SpiderMonkey. We will take some time to understand what the failing test is telling us about the language and the SpiderMonkey implementation. From there we will read and understand the behavior specified in the ECMA-262 text. We will implement the fix, step by step, in the engine, and explore any other issues that arise.

Each episode in a segment will be 1 hour long, followed by free chat for 30 minutes afterwards. If you have questions, feel free to ask them at any time. I will try to post materials ahead of time for you to read about before the stream.

If you missed part of the series, you can join at the beginning of any segment. If you have watched previous segments, then new segments will uncover new parts of the specification for you, and the repetition will make it easier to learn. A blog post summarizing the information in the stream will follow each completed segment.

 

Last but not least, a few thank yous

 

I have been fortunate enough to have my colleagues from the SpiderMonkey team and TC39 join the chat. Thank you to Iain Ireland, Jason Orendorff and Gus Caplan for joining the streams and answering questions for people. Thank you to Jan de Mooij and André Bargull for reviews and comments. Also a huge thank you to Sandra Persing, Rainer Cvillink, Val Grimm and Melissa Thermidor for the support in production and in getting the stream going, and to Mike Conley for the streaming tips.

About Yulia Startsev

More articles by Yulia Startsev…

13 comments

  1. Anand

    Wonderful blog

    June 25th, 2020 at 10:59

  2. Triandi Sihombing

    Is there a more practical application

    June 25th, 2020 at 20:21

  3. Aaron Wright

    No comments? This was pretty nuts to me. I’ve only ever just, like, used a programming language and this was like a “How It’s Made®” for javascript. Thank you

    June 26th, 2020 at 18:32

  4. paulo

    Why C++ and not Rust? Mozilla created Rust to be safer and fast. Why C++ instead?

    June 27th, 2020 at 07:15

    1. Yulia Startsev

      Project rewrites are tricky. They take years, with limited benefit to end users. We usually can’t work on new features (which JS developers look forward to) while a rewrite is happening, because we need to reimplement the old stuff. Even if we implement some of the newer stuff, it would probably have to be done in both engines, meaning that work goes much slower. It can result in a codebase that is potentially less performant, or less correct, than what we had before. So we need to weigh pros and cons carefully. At the moment, we have a very high performance with the current code base and it doesn’t make sense to make such a huge investment. That said, there are places that a rewrite makes sense to do in rust, for example the new front end.

      June 29th, 2020 at 02:42

  5. Samuel

    Very good.

    June 27th, 2020 at 10:54

  6. Mark

    I really enjoyed watching this. I came across this by accident. It was in a pop-up on Firefox. Can this kind of videos be shared on Mastodon where it can also reach people ?

    June 29th, 2020 at 02:20

    1. Yulia Startsev

      Thank you for the suggestion. I do have a mastodon, https://mastodon.social/@ioctaptceb — I will look into posting there

      June 29th, 2020 at 02:45

      1. Mark

        You got yourself a new follower ! Doesn’t seem like you use Mastodon a lot though. Never mind, I understand it’s not everyone’s cup of coffee. I enjoyed watching you dealing with those bugs and you really tried your best to describe what you were doing and why and how you think about solving these problems. You were super nervous. My guess is that your manager wanted to put you out of your comfort zone for little bit. Very important for world-class developers. I get uncomfortable often too and I’m not even in your league.

        June 29th, 2020 at 06:51

        1. Yulia Startsev

          Well, to be fair to my manager, I told him I was going to try this and he said “sounds good”. I am responsible for my suffering. It should get better over time though, just need a bit of practice!

          June 29th, 2020 at 07:01

  7. Bhavesh

    Awesome! thank you for sharing your knowledge.
    Keep up with the great work.

    June 30th, 2020 at 10:08

  8. ruth

    there *is* a difference between post and pre increment:
    in pre increment increments the variable before using it, post increment uses it first then incriments
    e.g.

    i=1; j=++i; // sets i and j to 2
    i=1;j=i++; // sets i to 2 and j to 1

    July 17th, 2020 at 05:16

    1. Yulia Startsev

      Yep, that’s right. It probably doesn’t come across in the recorded version, but this was covered in the stream comments that were happening concurrently with me talking. Jorendorff and Iain brought it up as soon as I said that I didn’t know of a difference. The episode you are referring to was the first one, where I was thinking on my feet and pretty nervous, so I might not have captured that fully. Unfortunately, twitch takes down the recorded streams, so that context disappears.

      July 17th, 2020 at 05:22

Comments are closed for this article.