Package Managers for JS - npm vs yarn

A package manager is a collection of software tools that automates the process of installing, upgrading, configuring and removing packages installed for your project.

Using a package manager, you can easily create project environments and easily import external dependencies. You can specify dependencies, a package name, author name, tags and keywords and version number. these help online repositories store your package and helps others find your project.

Without a package manager, if you wanted to install a package, you need to find the required package's source code and go through it's package.json file, where you would find a file called main.js. Include this in your application. You would need to repeat this for all packages that you want to install. You would need to track these files and make sure they are up to date. Using package managers instead save you a lot of time and work!

Two of the most widely used package managers for JavaScript are npm and yarn. Let's take a look at what they are and how they work!

What is npm?

image.png npm, Node Package Manager is a package manager for JavaScript, released in 2010 and maintained by npm Inc.

It consists of a command line client - also called npm, an online database of public and private packages called the npm registry and the npm website to manage various aspects of your npm experience. npm is the default package manager that is automatically installed when you install Node.js on your system.

What is yarn?

image.png Initially released by Facebook in 2016, Yarn is a package manager that also works as a project manager. According to its website, yarn allows you to use other developer's solutions to different problems, making it easier for you to develop your software.

The intention behind creating Yarn was to address some of the performance and security shortcomings (at that time) of working with npm.

Working

image.png Both yarn and npm provide the package.json file that exists at the root of the project's working directory. This file keeps all relevant data associated with the project and helps with managing the project dependencies' versions, scripts and more.

Both yarn and npm store dependency files in the node_modules folder. However, with Yarn 2, this folder is no long supported by default.

Both yarn and npm provide an auto-generated lock file which has entries of the dependencies and their versions used in the project. With yarn, it is called yarn.lock and with npm, it is called package-lock.json.

This file is automatically generated for any operations where either the node_modules tree or the lock file is modified. It describes the exact tree that was generated, such that future installs are able to generate identical trees, regardless of immediate dependency updates.

Installing packages with npm

  • npm init => Used to initialize the package.json file at the beginning of the project.

  • npm install => installs dependencies mentioned in the package.json file.

  • npm install [arguments] => can be run with or without arguments. When run with arguments, it installs the dependencies mentioned. When run without arguments, it installs the dependencies listed in the package.json file.

You can also install packages with options. A few options you can use are :

  1. --global or -g => installs package globally. Package is installed where package.json is defined and also in the global node_modules folder on the user's system.
  2. --save => installed packages will be saved as a dependency in the project's package.json file. This can be used when you want future installs to include this package.
  3. --save-dev => installed packages will be saved as devDependencies instead of dependencies.
  4. --production or -p => when installing with this option, only packages listed under dependencies will be installed. Packages listed under devDependencies will be excluded.
  • You can uninstall packages by running npm uninstall [package_name]

Installing packages with yarn

To install packages with yarn, we first need to install yarn. Run npm install -g yarn. Navigate to project folder and run yarn set version berry, berry is the code-name and repository for Yarn 2.

  • yarn init => run this to generate a package.json file.

  • yarn install => installs all dependencies in package.json.

  • yarn add [package_name] => installs packages mentioned.

  • yarn add [package_name] --dev => the --dev option lets you save the dependency to the devDependencies section.

  • yarn up [package] => upgrades dependency

  • yarn remove [package] => removes dependency

Performance

Performance of your package manager is important when managing a large number of packages.

One of the reasons why yarn was developed was to overcome the performance issues with npm. So initially, yarn was the clear winner in terms of performance.

However, with recent versions, npm has been considerably bridging the gap with yarn. While yarn is still faster in most cases, npm is quickly tightening this competition.

When installing packages, both yarn and npm need to carry out a series of tasks.

  • With npm, these tasks are performed sequentially - meaning, npm will wait for one task to be fully performed before moving on to the next.
  • With yarn, these tasks are performed in parallel, hence increasing speed in which packages are installed.

The below two images show express being installed using npm and yarn respectively. Installing express using npm Installing express using yarn

Security

When considering a package manager, security is another serious point to consider. While yarn was initially considered to be more secure, npm has immensely improved by introducing significant security improvements.

A new command, npm audit has been introduced with npm version 6, to assist you in recursively assessing your dependency tree to identify abnormalities.

Yarn, on the other hand, has security features including checksum to verify the integrity of every package you want to install and also the ability to check licenses of your installed packages.

Choosing between npm and yarn

While performance and security are important, another factor to consider while choosing your package manager is - ease of use. This includes the user interface or how the command line terminal looks after running npm or yarn commands.

npm and yarn have different command line interfaces. They are both user-friendly and have a good user experience. They both also provide an interactive guide that helps users to initialize a Node.js project.

npm is very verbose. It recursively lists all the installed packages.

yarn on the other hand, isn't verbose at all. Details can be obtained via other commands but it lists significantly less information compared to npm.

Even though yarn has a lot of advantages, there are 2 main issues one may face while transferring their project from npm to yarn -

  • yarn doesn't work with any Node.Js version older than 5
  • and there are a few problems with installing native modules

Conclusion

The two package managers are great at managing and maintaining your project dependencies tree. They are reliable and have great support in the JavaScript community.

There are not many comparisons to be drawn between the two. You can use yarn in pretty much every case that you would npm and with the added features, npm is almost identical to yarn.

The choice between the two depends on personal preference, performance, community support and ease of use.

Resources