Yarn: From Design to Implementation

Rate this content
Bookmark

In this talk, we'll go over the various iterations the Yarn team went through designing one of the most critical software in the JavaScript ecosystem. We'll discuss some of the main choices, trade-offs, errors, and successes we faced, and think about evolutions to come and future challenges that await us. By the end of this talk you'll have a better understanding of the work large-scale open-source teams do behind the team, and hopefully a better understanding of what makes open-source so special.

Maël Nison
Maël Nison
28 min
15 Feb, 2024

Comments

Sign in or register to post your comment.

Video Summary and Transcription

Today we'll discuss the evolution and implementation of YARN, which focuses on determinism and stability. YARN Modern was re-architected to support projects with multiple packages and embraced Monorepos. YARN 2 improved workspace implementation, codebase partitioning, and stability. Dependency resolution and linking in YARN are handled by different resolvers and fetchers. YARN has a plugin system, a constraint engine, and a redesigned website. It prioritizes compatibility, performance, testing, and contributions to other projects.

Available in Español: Yarn: De Diseño a Implementación

1. Introduction to YARN

Short description:

Today we're going to talk about how YARN came to be, what it evolved into, and interesting tidbits about its implementation. I'm Maren Lison, a staff developer experience engineer at Datadog, leading the development of YARN since 2017. YARN is split into three parts: classics, modern, and implementation details. Classic YARN was created to address problems with consistency, security, and performance at Facebook. We chose to create YARN instead of contributing to NPM because we wanted to address different priorities. YARN focuses on determinism and stability.

Hi, everyone, and welcome to my talk about YARN. Today we're going to talk a bit about how it came to be, what it evolved into, and interesting tidbits about its implementation.

So first, my name is Maren Lison, I'm a staff developer experience engineer at Datadog. And I've been leading the development of YARN since 2017, from the zero point something up to the 4.0 that it currently is.

I split the content of this presentation into three parts. First we're going to talk a bit about YARN classics. Then we're going to go to YARN modern, so everything from 2.0 until today. And finally, we're going to jump into interesting details about either the implementation of YARN or some meta knowledge about YARN.

First thing, YARN classic. So classic is everything that is pre 2.0. Why did we create YARN classic? The answer is if you look at the blog post that got released around the time to introduce YARN, you will see this interesting sentence. As the size of our code base and the number of engineers grew at Facebook, we ran into problems with consistency, security and performance. At the time, the JavaScript ecosystem was very different from what it currently is, and it was very difficult to be sure that when you were running a project it would be working for everyone across the organization. That's something that didn't really work at the scale that Facebook was operating, so they decided to put some resources into trying to figure out a solution.

However, now let's take the same question but with a different emphasis. Why did we create YARN? Why didn't we just contribute to NPM? The reason for that is that it felt at the time there were so many different things that we wanted to attempt to address, that contributing to NPM wouldn't have made sense. Each project has their own priorities, and some of the things that YARN intended to address were not things that NPM intended to challenge, because they felt that it was the developer experience they wanted to have. That's completely fair. We decided that it would be easier to just create one other project that would make different trade-offs and would follow a different exploration path. Contributing wasn't really an option because we didn't want to push against NPM on a project that was entirely theirs. Remember that NPM was also a company at the time, so they had their own priorities.

When we built YARN, we decided to focus on four different core areas. The first one was determinism. It's easy to remember log files as being used everywhere, basically. However, at the time, they were very rare. We were a project. We were not enforcing the version of their dependencies across different installs, meaning that everyone would get different things. We felt that it was important that projects that work now should work in the future, and for that, YARN had to do some focus work on that. Additionally, we wanted YARN to be safe, meaning that we wanted to catch as many bugs as possible before they would even ship in production. So stability was very important to us.

2. YARN Features and Stability

Short description:

We focused on the user experience of working with the CLI, made YARN fully open source, and released it as a separate project. The initial product offering included log files, an offline mirror, and emojis for better CLI output. YARN was fully typed using Flow for improved stability.

A clean UX was also very important. We wanted YARN to be a tool that could be approached by anyone without having deep knowledge of how package managers work, how projects are set up. To that end, we decided to focus a little on the user experience of working with the CLI and not just the implementation of the software itself.

Finally, we wanted it to be fully open source. I mentioned that NPM was a company, and actually it still is a company, but now owned by GitHub. NPM was a startup, meaning that it was receiving investment from VCs, and it felt like the incentives weren't completely aligned with what the JavaScript ecosystem needed. So we really wanted YARN to be fully open source, and it got released as a project that wasn't even part of Facebook. Nowadays, Facebook doesn't actually have any part in it. It's only maintained by people from different companies.

The initial product offering when we released YARN, there were four main different things. The first one, of course, was log files. Log files all the day. At the time, NPM added shrinkwraps, which allowed you to log the version of your dependencies, but were not enabled by default. It also had an effect on transitive installs. They were a little weird and we wanted to have something simpler to understand, and that would be enabled by default. We also shipped with the offline mirror, which also followed the same strategy of how can we make sure that the project will keep being installed in the future. What if the NPM registry goes down, whether temporarily or permanently? Can we make sure that it doesn't affect us, because it doesn't affect our installs? The offline mirror lets you store the tarballs of the cache of your project, somewhere you control, for instance, inside your Git repository, but not necessarily. You can also store it inside a specific file system. So that even if the registry is down, YARN can still install your project just fine. It also shipped with emojis. I know that when you read emoji as a product feature, that doesn't seem very important, but actually, it kind of was for our users. I think it also showed that the output of the CLI is very important, and making it easier to parse for humans makes a lot of sense. Nowadays we do that with different things than emojis. We do that using semantic colors on the different components that we display. But that's the kind of attention that we decided to put into the developer experience.

And finally, this one is more about the maintenance that YARN features themselves, but they go into the stability bucket that I mentioned earlier. YARN was fully typed using Flow, not TypeScript at the time. And that was very important because it allowed us to cache many issues that we wouldn't have caught otherwise if we had not type-checked the codebase. NPM was following a very different strategy where they intended to have full coverage through tests. However, from our experience, doing something like that would still have let things pass that shouldn't have been shipped.

Check out more articles and videos

We constantly think of articles and videos that might spark Git people interest / skill us up or help building a stellar career

Levelling up Monorepos with npm Workspaces
DevOps.js Conf 2022DevOps.js Conf 2022
33 min
Levelling up Monorepos with npm Workspaces
Top Content
Learn more about how to leverage the default features of npm workspaces to help you manage your monorepo project while also checking out some of the new npm cli features.
Remix Flat Routes – An Evolution in Routing
Remix Conf Europe 2022Remix Conf Europe 2022
16 min
Remix Flat Routes – An Evolution in Routing
Top Content
This talk introduces the new Flat Routes convention that will most likely be the default in a future version of Remix. It simplifies the existing convention as well as gives you new capabilities.
The Zen of Yarn
DevOps.js Conf 2022DevOps.js Conf 2022
31 min
The Zen of Yarn
In the past years Yarn took a spot as one of the most common tools used to develop JavaScript projects, in no small part thanks to an opinionated set of guiding principles. But what are they? How do they apply to Yarn in practice? And just as important: how do they benefit you and your projects?
In this talk we won't dive into benchmarks or feature sets: instead, you'll learn how we approach Yarn’s development, how we explore new paths, how we keep our codebase healthy, and generally why we think Yarn will remain firmly set in our ecosystem for the years to come.
How to Make a Web Game All by Yourself
JS GameDev Summit 2023JS GameDev Summit 2023
27 min
How to Make a Web Game All by Yourself
It's never been easier to make your own web game, but it's still extremely difficult. What game should you make? Which engine should you choose? Let's discuss how to answer these problems and ways to leverage the unique platform that is the web.
Atomic Deployment for JS Hipsters
DevOps.js Conf 2024DevOps.js Conf 2024
25 min
Atomic Deployment for JS Hipsters
Deploying an app is all but an easy process. You will encounter a lot of glitches and pain points to solve to have it working properly. The worst is: that now that you can deploy your app in production, how can't you also deploy all branches in the project to get access to live previews? And be able to do a fast-revert on-demand?Fortunately, the classic DevOps toolkit has all you need to achieve it without compromising your mental health. By expertly mixing Git, Unix tools, and API calls, and orchestrating all of them with JavaScript, you'll master the secret of safe atomic deployments.No more need to rely on commercial services: become the perfect tool master and netlifize your app right at home!
Your GraphQL Groove
GraphQL Galaxy 2022GraphQL Galaxy 2022
31 min
Your GraphQL Groove
Building with GraphQL for the first time can be anywhere between daunting and easy-peasy. Understanding which features to look for in your client-side and server-side tooling and getting into the right habits (and ridding yourself of old habits) is the key to succeed with a team of any size in GraphQL.

This talk gives an overview of common struggles I've seen numerous teams have when building with GraphQL, how they got around common sources of frustration, and the mindset they eventually adopted, and lessons learned, so you can confidently stick with and adopt GraphQL!

Workshops on related topic

Finding, Hacking and fixing your NodeJS Vulnerabilities with Snyk
JSNation 2022JSNation 2022
99 min
Finding, Hacking and fixing your NodeJS Vulnerabilities with Snyk
WorkshopFree
Matthew Salmon
Matthew Salmon
npm and security, how much do you know about your dependencies?Hack-along, live hacking of a vulnerable Node app https://github.com/snyk-labs/nodejs-goof, Vulnerabilities from both Open source and written code. Encouraged to download the application and hack along with us.Fixing the issues and an introduction to Snyk with a demo.Open questions.
Build Web3 apps with React
React Summit 2022React Summit 2022
51 min
Build Web3 apps with React
WorkshopFree
Shain Dholakiya
Shain Dholakiya
The workshop is designed to help Web2 developers start building for Web3 using the Hyperverse. The Hyperverse is an open marketplace of community-built, audited, easy to discover smart modules. Our goal - to make it easy for React developers to build Web3 apps without writing a single line of smart contract code. Think “npm for smart contracts.”
Learn more about the Hyperverse here.
We will go over all the blockchain/crypto basics you need to know to start building on the Hyperverse, so you do not need to have any previous knowledge about the Web3 space. You just need to have React experience.
How to create editor experiences your team will love
React Advanced Conference 2021React Advanced Conference 2021
168 min
How to create editor experiences your team will love
Workshop
Lauren Etheridge
Knut Melvær
2 authors
Content is a crucial part of what you build on the web. Modern web technologies brings a lot to the developer experience in terms of building content-driven sites, but how can we improve things for editors and content creators? In this workshop you’ll learn how use Sanity.io to approach structured content modeling, and how to build, iterate, and configure your own CMS to unify data models with efficient and delightful editor experiences. It’s intended for web developers who want to deliver better content experiences for their content teams and clients.