Yarn vs npm: Everything You Need to Know

In this tutorial, we’ll compare Yarn vs npm — the two most popular package managers. We’ll set them side by side and explore their respective benefits and disadvantages to help you choose which one to use for your projects.

Laying Out the Basics

Back in the good old days, a simple text editor was enough for developers to create and manage the large part of their projects. But since then, the Web has changed drastically. Nowadays, it’s common for even a fairly simple project to have hundreds or thousands of scripts, with complex nested dependencies, which are simply impossible to manage without some kind of automated tool. And this is the place where package managers come into play.

A package manager is a tool that automatically handles a project’s dependencies in a variety of ways. For example, with the help of a package manager we can install, uninstall, update, and upgrade packages, configure project settings, run scripts, and so on. All the hard and tedious work is done by the package manager, leaving to us only the fun part — the coding itself.

npm stands for Node Package Manager. It was released back in 2010, beginning a new era in web development. Until then, the project dependencies were downloaded and managed manually. npm was the magic wand that pushed the Web to the next level.

npm actually involves three things:

  • a website for managing various aspects of your npm experience
  • a registry for accessing an extensive public database of JavaScript packages
  • a command-line interface (CLI) for interacting with npm via the terminal

However, when most people talk about npm, they usually mean the last one — the CLI tool. It ships as a default package manager with each fresh Node installation. This means you can start using it right away.

If you’d like a deep dive into working with npm, please consult our Node Package Manager Guide.

Yarn stands for Yet Another Resource Negotiator. The Yarn package manager is an alternative to npm, released by Facebook in October 2016. The original goal of Yarn was to deal with npm drawbacks, such as performance and security issues. Yarn was quickly positioned as a safe, fast, and reliable JavaScript dependency management tool.

But the npm team learned their lesson and rapidly filled the npm gaps by implementing the missing features.

Let’s quickly travel through time to see the big picture:

  • 2010: npm is released with support for Node.
  • 2016: Yarn is released. It shows much greater performance than npm. It also generate a yarn.lock file that makes sharing and exact replication of repos much easier and predictable.
  • 2017: npm 5 is released. It offers auto-generation of a package-lock.json file in answer to yarn.lock.
  • 2018: npm 6 is released with improved security. Now npm checks security vulnerabilities before dependencies are installed.
  • 2020: Yarn 2 and npm 7 are released. Both packages come with great new features, as we’ll see later in this tutorial.
  • 2021: Yarn 3 is released with various improvements.

Nowadays, both package managers are neck and neck in the package management race, offering similar features and capabilities. But there are still several differences that help to determine which we choose to use.

In the rest of this tutorial, we’ll explore the main similarities and differences between npm and Yarn.

Yarn vs npm: an Installation Comparison

We’ll start our comparison exploration with the installation process for both npm and Yarn.

Installing the package managers themselves

As I noted above, npm comes preinstalled with Node, so there’s no need to install npm manually.

In contrast, Yarn needs to be installed explicitly. First, we need to install Yarn globally:

npm install -g yarn 

Then, we can use it on a per-project basis by setting the desired version inside our project. We do that by running the yarn set version command in the project’s root directory:

yarn set version berry 

In this case, berry is the version we want to set.

If we want to update to the latest version, we run this:

yarn set version latest 

With Yarn we can use a different version for each project.

To do the same with npm, you’ll need to have nvm (Node Version Manager) installed. Here’s how to install multiple versions of Node using nvm.

Installing project dependencies

Now, let’s see how project dependencies are installed.

When we run npm install, the dependencies are installed sequentially, one after another. The output logs in the terminal are informative but a bit hard to read.

To install the packages with Yarn, we run the yarn command. Yarn installs packages in parallel, which is one of the reasons it’s quicker than npm. If you’re using Yarn 1, you’ll see that the yarn output logs are clean, visually distinguishable and brief. They’re also ordered in a tree form for easy comprehension. But this is changed in versions 2 and 3, where the logs aren’t so intuitive and human-readable.

So far, we’ve seen that npm and Yarn have different commands for installing packages. In the next section, we’ll explore more commands.

Continue reading Yarn vs npm: Everything You Need to Know on SitePoint.

Similar Posts