Yarn 4 - Modern Package Management

This ad is not shown to multipass and full ticket holders
React Advanced
React Advanced 2026
October 23 - 26, 2026
London, UK & Online
Upcoming event
React Advanced 2026
React Advanced 2026
October 23 - 26, 2026. London, UK & Online
Bookmark
Rate this content
Sentry
Promoted
Code breaks, fix it faster

Crashes, slowdowns, regressions in prod. Seer by Sentry unifies traces, replays, errors, profiles to find root causes fast.

Get started

Yarn 4 is the next major release of your favourite JavaScript package manager, with a focus on performance, security, and developer experience. All through this talk we'll go over its new features, major changes, and share our long-term plans for the project.

If you only heard about Yarn without trying it yet, if you're not sure why people make such a fuss over package managers, if you wonder how your package manager can make your work simpler and safer, this is the perfect talk for you!

This talk has been presented at JSNation 2022, check out the latest edition of this JavaScript Conference.

FAQ

Yarn's core values include stability, maintainability, modernity, and security. These principles guide the development and future direction of the project.

Yarn aims for deterministic and predictable behavior. If something works or crashes for one user, it should behave the same for others, making it easier to reproduce and fix issues.

Plug'n'Play is an install strategy introduced in Yarn 2.0 that allows you to avoid having a node_modules folder. It shares dependencies across all projects on your machine and prevents ghost dependencies.

You can contribute to Yarn by looking for issues labeled 'good first issues' on their GitHub, joining the Yarn Discord community, and following their contribution guidelines. The team is open to new contributors and provides guidance on making contributions.

The Exec Protocol allows you to create your own packages dynamically during an install. For example, you can fetch a package from SVN or any other location using a JavaScript script defined in the Exec Protocol.

Yarn can automatically install @types packages if they are missing when you add a new dependency in a TypeScript project. This behavior can be enabled or disabled based on your preference.

Corepack is a tool that manages the version of your package manager on a per-project basis rather than globally. It ensures that everyone on your team uses the exact same version of the package manager, promoting consistency.

Yarn 4.0 includes features like a battery-included CLI, opt-in local cache, security enhancements with check resolution and refresh lockfile, and an experimental stable resolution strategy to prevent supply chain attacks.

Constraints in Yarn allow you to enforce rules across your workspaces. For example, you can ensure that no workspace depends on both Lodash and Underscore, or that all workspaces use the same version of React.

Yarn is a package manager similar to NPM that allows you to install packages on your system to resolve dependencies. It emphasizes consistency, stability, and performance for your projects.

Maël Nison
Maël Nison
28 min
16 Jun, 2022

Comments

Sign in or register to post your comment.
Video Summary and Transcription
Yarn 4 is a modern package manager that emphasizes stability, maintainability, and security. Unlike other package managers, Yarn 4 is open source and offers unique features like Plug'n'Play, which eliminates the need for a node_modules folder by sharing dependencies across projects. This feature, introduced in Yarn 2.0, enhances consistency and prevents ghost dependencies. Yarn 4 also includes the Exec Protocol, which allows dynamic package creation during installation, and Corepack, a tool that manages package manager versions per project to ensure team consistency. The new release features a battery-included CLI, opt-in local cache, and security enhancements such as check resolution and refresh lockfile. Yarn 4's focus on modularity allows for custom logic and specific use cases, making it a popular choice for developers looking for a reliable package management solution. Users interested in exploring Yarn 4's capabilities can start contributing by looking at 'good first issues' on GitHub or joining the Yarn community on Discord.

1. Introduction to Yarn

Short description:

Hello, everyone! I'm Mael, and I've been leading the development for Yarn. Today, I'll talk about Yarn's core values, our goals for each release, and the future of Yarn. Yarn is a package manager similar to NPM, emphasizing consistency, stability, and good performance. We released the first version of Yarn six years ago, and now we are working on the 4.0 release.

[♪ music playing ♪ ♪ Hello, everyone, so my name is Mael. I work at Datadog. And I've been leading the development for Yarn for the past few years.

So today I'm going to talk to you a bit about Yarn, what are its core values, what we are aiming for, for each version that we release and show you a glimpse of the future.

Before we start, what is Yarn? So Yarn is a package manager that you may know, similar to NPM, that allows you to install packages on your system to resolve dependencies. And it favors consistency and stability while still attempting to provide good performances and high moderality to your projects.

It's been a long adventure, the first version of Yarn got released almost six years ago, with 0.15, one year later we released the first stable release with 1.0, and two years and a half later we decided that it was time to make a change and to decide for sure what we wanted to do in the future of Yarn, and with that came the 2.0.

At the time, there were a lot of discussion about some of the core aspects that we have been working on in the subsequent release of the 3.0, and that we are going to keep refining in the 4.0.

2. Yarn's Priorities and Unique Features

Short description:

Why another package manager? Yarn brings unique properties and priorities to the table. Stability is a core tenet, ensuring consistent and predictable experiences. Maintainability and future-proofing are key considerations. Yarn is designed to be modular, allowing for custom logic and specific use cases. Security is also a focus to prevent future attacks. Performance is not discussed due to the current year.

Why another package manager? We already have MPM, we also have PMPM, what does Yarn bring to the table? The thing to remember, and that's true for package managers, but also true for say, bundlers is that features and performances aside, each project in the open source ecosystem has different properties in terms of priorities, roadmap, governance model, maintainability, infrastructure. All those things are things that you should keep in mind each time you try to evaluate a project. Because for instance, MPM is owned by GitHub, whereas Yarn is completely open source. In both cases, there are pros and cons, and that's the kind of thing that you don't see at the very first glance, but that's makes sense when you're trying to invest in a tool in the long term.

So I talked about priorities. What are Yarn's priorities? We have four of them at the moment. The last one got added quite recently and we are going to talk about it in the future slides, but first, stability is the main core tenet of Yarn. We want all your installs, all your experience of using Yarn to be deterministic and predictable. If something works for you, then it should work for your colleagues. If something crashes for you, then it should crash also for your colleagues. And this last part is quite important because making sure that a program fails consistently allows you to make sure that it will also work consistently. If someone has a problem, you will be able to reproduce the issue and to help them get past it. Maintainability. We are trying to set up the project not only so that it succeeds now, but also that it succeeds in the future. The way we see Yarn, Yarn will still be there in ten years. How can we make sure that Yarn will still be in good shape in ten years? That's not so easy because it means we have to make choices in terms of government, in terms of architecture of our own repository. How can we keep the code base healthy? So that's one of our priorities.

Modernity is another one. Back in Yarn 1, we noticed that a lot of you had very specific use cases. It was very difficult for us to implement all the features that you needed, sometimes that only one company needed. So instead what we decided to do with Modern Release of Yarn is to make our core modular. Meaning that you can write plugins, you can write commands that go into the core Yarn API that we provide that we document. And you can make your own logic on a very few simple lines of code. Almost all of the Yarn commands are implemented through this system. For instance, the install itself takes something like 50 lines to implement. And finally, security. That's something that we are starting to introduce, because even though Yarn was safe before in that we tried to prevent packages from accessing your disk, there are other types of attacks. During the past few months you may have heard about attacks such as UAParser.js or Faker.js, these kind of problems that are starting to rise, and we want to provide a solution so that it's not a problem in the future. You may notice that I didn't talk about performances. That's because we are in 2022.

QnA

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

Scaling Up with Remix and Micro Frontends
Remix Conf Europe 2022Remix Conf Europe 2022
23 min
Scaling Up with Remix and Micro Frontends
Top Content
This talk discusses the usage of Microfrontends in Remix and introduces the Tiny Frontend library. Kazoo, a used car buying platform, follows a domain-driven design approach and encountered issues with granular slicing. Tiny Frontend aims to solve the slicing problem and promotes type safety and compatibility of shared dependencies. The speaker demonstrates how Tiny Frontend works with server-side rendering and how Remix can consume and update components without redeploying the app. The talk also explores the usage of micro frontends and the future support for Webpack Module Federation in Remix.
Full Stack Components
Remix Conf Europe 2022Remix Conf Europe 2022
37 min
Full Stack Components
Top Content
RemixConf EU discussed full stack components and their benefits, such as marrying the backend and UI in the same file. The talk demonstrated the implementation of a combo box with search functionality using Remix and the Downshift library. It also highlighted the ease of creating resource routes in Remix and the importance of code organization and maintainability in full stack components. The speaker expressed gratitude towards the audience and discussed the future of Remix, including its acquisition by Shopify and the potential for collaboration with Hydrogen.
Debugging JS
React Summit 2023React Summit 2023
24 min
Debugging JS
Top Content
Debugging JavaScript is a crucial skill that is often overlooked in the industry. It is important to understand the problem, reproduce the issue, and identify the root cause. Having a variety of debugging tools and techniques, such as console methods and graphical debuggers, is beneficial. Replay is a time-traveling debugger for JavaScript that allows users to record and inspect bugs. It works with Redux, plain React, and even minified code with the help of source maps.
Making JavaScript on WebAssembly Fast
JSNation Live 2021JSNation Live 2021
29 min
Making JavaScript on WebAssembly Fast
Top Content
WebAssembly enables optimizing JavaScript performance for different environments by deploying the JavaScript engine as a portable WebAssembly module. By making JavaScript on WebAssembly fast, instances can be created for each request, reducing latency and security risks. Initialization and runtime phases can be improved with tools like Wiser and snapshotting, resulting in faster startup times. Optimizing JavaScript performance in WebAssembly can be achieved through techniques like ahead-of-time compilation and inline caching. WebAssembly usage is growing outside the web, offering benefits like isolation and portability. Build sizes and snapshotting in WebAssembly depend on the application, and more information can be found on the Mozilla Hacks website and Bike Reliance site.
Webpack in 5 Years?
JSNation 2022JSNation 2022
26 min
Webpack in 5 Years?
Top Content
In the last 10 years, Webpack has shaped the way we develop web applications by introducing code splitting, co-locating style sheets and assets with JavaScript modules, and enabling bundling for server-side processing. Webpack's flexibility and large plugin system have also contributed to innovation in the ecosystem. The initial configuration for Webpack can be overwhelming, but it is necessary due to the complexity of modern web applications. In larger scale applications, there are performance problems in Webpack due to issues with garbage collection, leveraging multiple CPUs, and architectural limitations. Fixing problems in Webpack has trade-offs, but a rewrite could optimize architecture and fix performance issues.
Towards a Standard Library for JavaScript Runtimes
Node Congress 2022Node Congress 2022
34 min
Towards a Standard Library for JavaScript Runtimes
Top Content
There is a need for a standard library of APIs for JavaScript runtimes, as there are currently multiple ways to perform fundamental tasks like base64 encoding. JavaScript runtimes have historically lacked a standard library, causing friction and difficulty for developers. The idea of a small core has both benefits and drawbacks, with some runtimes abusing it to limit innovation. There is a misalignment between Node and web browsers in terms of functionality and API standards. The proposal is to involve browser developers in conversations about API standardization and to create a common standard library for JavaScript runtimes.

Workshops on related topic

Master JavaScript Patterns
JSNation 2024JSNation 2024
145 min
Master JavaScript Patterns
Top Content
Featured Workshop
Adrian Hajdin
Adrian Hajdin
During this workshop, participants will review the essential JavaScript patterns that every developer should know. Through hands-on exercises, real-world examples, and interactive discussions, attendees will deepen their understanding of best practices for organizing code, solving common challenges, and designing scalable architectures. By the end of the workshop, participants will gain newfound confidence in their ability to write high-quality JavaScript code that stands the test of time.
Points Covered:
1. Introduction to JavaScript Patterns2. Foundational Patterns3. Object Creation Patterns4. Behavioral Patterns5. Architectural Patterns6. Hands-On Exercises and Case Studies
How It Will Help Developers:
- Gain a deep understanding of JavaScript patterns and their applications in real-world scenarios- Learn best practices for organizing code, solving common challenges, and designing scalable architectures- Enhance problem-solving skills and code readability- Improve collaboration and communication within development teams- Accelerate career growth and opportunities for advancement in the software industry
Using CodeMirror to Build a JavaScript Editor with Linting and AutoComplete
React Day Berlin 2022React Day Berlin 2022
86 min
Using CodeMirror to Build a JavaScript Editor with Linting and AutoComplete
Top Content
Workshop
Hussien Khayoon
Kahvi Patel
2 authors
Using a library might seem easy at first glance, but how do you choose the right library? How do you upgrade an existing one? And how do you wade through the documentation to find what you want?
In this workshop, we’ll discuss all these finer points while going through a general example of building a code editor using CodeMirror in React. All while sharing some of the nuances our team learned about using this library and some problems we encountered.
Testing Web Applications Using Cypress
TestJS Summit - January, 2021TestJS Summit - January, 2021
173 min
Testing Web Applications Using Cypress
Top Content
Workshop
Gleb Bahmutov
Gleb Bahmutov
This workshop will teach you the basics of writing useful end-to-end tests using Cypress Test Runner.
We will cover writing tests, covering every application feature, structuring tests, intercepting network requests, and setting up the backend data.
Anyone who knows JavaScript programming language and has NPM installed would be able to follow along.
React Server Components Unleashed: A Deep Dive into Next-Gen Web Development
React Day Berlin 2023React Day Berlin 2023
149 min
React Server Components Unleashed: A Deep Dive into Next-Gen Web Development
Top Content
Workshop
Maurice de Beijer
Maurice de Beijer
Get ready to supercharge your web development skills with React Server Components! In this immersive, 3-hour workshop, we'll unlock the full potential of this revolutionary technology and explore how it's transforming the way developers build lightning-fast, efficient web applications.
Join us as we delve into the exciting world of React Server Components, which seamlessly blend server-side rendering with client-side interactivity for unparalleled performance and user experience. You'll gain hands-on experience through practical exercises, real-world examples, and expert guidance on how to harness the power of Server Components in your own projects.
Throughout the workshop, we'll cover essential topics, including:- Understanding the differences between Server and Client Components- Implementing Server Components to optimize data fetching and reduce JavaScript bundle size- Integrating Server and Client Components for a seamless user experience- Strategies for effectively passing data between components and managing state- Tips and best practices for maximizing the performance benefits of React Server Components
0 to Auth in an Hour Using NodeJS SDK
Node Congress 2023Node Congress 2023
63 min
0 to Auth in an Hour Using NodeJS SDK
WorkshopFree
Asaf Shen
Asaf Shen
Passwordless authentication may seem complex, but it is simple to add it to any app using the right tool.
We will enhance a full-stack JS application (Node.JS backend + React frontend) to authenticate users with OAuth (social login) and One Time Passwords (email), including:- User authentication - Managing user interactions, returning session / refresh JWTs- Session management and validation - Storing the session for subsequent client requests, validating / refreshing sessions
At the end of the workshop, we will also touch on another approach to code authentication using frontend Descope Flows (drag-and-drop workflows), while keeping only session validation in the backend. With this, we will also show how easy it is to enable biometrics and other passwordless authentication methods.
Table of contents- A quick intro to core authentication concepts- Coding- Why passwordless matters
Prerequisites- IDE for your choice- Node 18 or higher
Getting Started with AG Grid and React – The Best Javascript Grid in the World
React Advanced 2022React Advanced 2022
140 min
Getting Started with AG Grid and React – The Best Javascript Grid in the World
Workshop
Brian Love
Brian Love
Does your React app need to efficiently display lots (and lots) of data in a grid? Do your users want to be able to search, sort, filter, and edit data? AG Grid is the best JavaScript grid in the world and is packed with features, highly performant, and extensible. In this workshop, you’ll learn how to get started with AG Grid, how we can enable sorting and filtering of data in the grid, cell rendering, and more. You will walk away from this free 3-hour workshop equipped with the knowledge for implementing AG Grid into your React application.
We all know that rolling our own grid solution is not easy, and let's be honest, is not something that we should be working on. We are focused on building a product and driving forward innovation. In this workshop, you'll see just how easy it is to get started with AG Grid.
Prerequisites: Basic React and JavaScript
Workshop level: Beginner