This article will dive into two popular JavaScript package managers, Yarn and npm, and compare their respective pros and cons to help you choose the right tool for your project.
Core points
Basics
In the past, a simple text editor was enough for developers to create and manage most projects. But now, the Internet has undergone earth-shaking changes. Now, even a fairly simple project can contain hundreds or even thousands of scripts, as well as complex nested dependencies that simply cannot be managed without some kind of automation tool. This is where the package manager comes into play.
Package manager is a tool that automatically handles project dependencies in multiple ways. For example, with the package manager, we can install, uninstall, update and upgrade packages, configure project settings, run scripts, and more. All the tedious work is done by the package manager, we just need to focus on the encoding itself.
npm stands for Node Package Manager. It was released in 2010, opening a new era of web development. Prior to this, project dependencies were downloaded and managed manually. npm is the wand that drives the web to a higher level.
npm actually contains three parts:
But when most people talk about npm, they usually refer to the last one - the CLI tool. It is provided as the default package manager with each new Node installation. This means you can start using it right away.
If you want to dig into how to use npm, see our Node Package Manager guide.
Yarn stands for Yet Another Resource Negotiator. Yarn Package Manager is an alternative to npm, released by Facebook in October 2016. Yarn's initial goal was to address the shortcomings of npm, such as performance and security issues. Yarn quickly became a secure, fast and reliable JavaScript dependency management tool.
But the npm team learned the lesson and quickly made up for npm's shortcomings by implementing the missing features.
Let's quickly review history to understand the overall situation:
These two package managers are comparable in package management competitions and offer similar features. But there are still some differences that help us determine which one to use.
In the rest of this tutorial, we will explore the main similarities and differences between npm and Yarn.
Yarn vs. npm: Installation comparison
We will start with the installation process of npm and Yarn.
As mentioned above, npm is pre-installed in Node, so there is no need to manually install npm.
Instead, Yarn needs to be installed explicitly. First, we need to install Yarn:
npm install -g yarn
We can then use it on a per-project basis by running the yarn set version command in the project 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 the following command:
yarn set version latest
With Yarn, we can use a different version for each project.
To do the same with npm, you need to install nvm (Node version manager). Here is how to install multiple Node versions using nvm.
Now, let's see how to install project dependencies.
When we run npm install, the dependencies are installed in turn. The output logs in the terminal are rich in information, but they are a bit difficult to read.
To use the Yarn installation package, we run the yarn command. Yarn parallel installation packages, which is one of the reasons why it is faster than npm. If you are using Yarn 1, you will see that the yarn output log is concise and easy to distinguish visually. They are also sorted in tree form for easy understanding. But in versions 2 and 3, the logs are not so intuitive.
So far, we have seen that npm and Yarn have different installation package commands. In the next section, we will explore more commands.
Compare npm and Yarn commands
npm and Yarn share many commands, but there are some different commands. Let's first explore some of the same commands:
These commands make it easy to switch between two managers, but there are some different commands that can be confusing. Let's see what they are in the next list:
Yarn also has some unique commands that npm does not have. For example, the why command shows why packages are needed: it could be a dependency, a local module, or a project dependency.
Yarn vs. npm: Speed and Performance
Whenever Yarn or npm needs to install a package, they perform a series of tasks. In npm, these tasks are performed by packages, meaning that it will continue to the next package after one package is fully installed. Instead, Yarn performs these tasks in parallel, thereby improving performance.
Although both managers provide caching mechanisms, Yarn seems to do a little better. By implementing the zero installation paradigm (which we will see in the Feature Comparison section), it is able to install packages almost immediately. It caches each package and saves it on disk, so the next time you install this package, you don't even need an internet connection because the package is installed offline from disk.
Although Yarn has some advantages, in its latest version, Yarn and npm are at comparable speeds. Therefore, we cannot define a clear winner here.
Yarn vs. npm: Safe comparison
One of the main criticisms of npm is about security. Previous npm versions had some serious security vulnerabilities.
As of version 6, npm audits the package during installation and tells you if you find any vulnerabilities. We can perform this check manually by running npm audit on installed packages. If any vulnerabilities are found, npm will provide us with security advice.
As shown in the above figure, we can run npm audit fix to fix package vulnerabilities, and if it can be fixed, the dependency tree will be fixed as well.
Yarn and npm both use cryptographic hashing algorithms to ensure packet integrity.
Yarn vs. npm: Functional comparison
As with commands, npm and Yarn share some features, but there are some differences. Let's first explore the common functionality shared by these two package managers.
In package.json (the file that npm and Yarn are used to track project dependencies), the version number is not always accurate. Instead, you can define a version range. This way, you can select a specific major and minor version of the package, but allow npm to install the latest patches that may fix some bugs.
In the ideal world of semantic versioning, the patch version does not contain any significant changes. But unfortunately, this is not always the case. The strategy used by npm may cause both machines to end up with the same package.json file, but have different versions of the package installed - this may introduce an error.
To avoid package version mismatch, the installed exact version is fixed in the package lock file. Each time a module is added, npm and Yarn create (or update) package-lock.json and yarn.lock files, respectively. This way, you can ensure that another machine installs the exact same package while still defining a series of allowed versions in package.json.
The workspace allows you to have a monorepo to manage dependencies in multiple projects. This means you have a single top-level root package that has multiple subpackages called workspaces.
npx command is used to run scripts from ./node_modules/.bin. It also allows you to execute packages from the npm registry without installing them into your project dependencies. For example, you can create a new React application by running the following command:
npm install -g yarn
In Yarn, you can use the equivalent dlx command to achieve the same result:
yarn set version berry
The rest of the features we will explore are unique to Yarn.
Zero installation stores the cache in your project directory, located in the .yarn folder. When you use commands such as yarn or yarn add
Plug’n’Play is an alternative installation strategy. Yarn does not generate the node_modules directory and leave parsing to Node, but instead generates a single .pnp.cjs file that maps packages to locations on disk and its dependencies list. This feature can speed up project startup, optimize dependency trees, speed up installation, and of course eliminate the need for node_modules folder.
Yarn has a license checker built in, which is very useful in different scenarios when developing applications.
Yarn vs. npm: which package manager to choose
We have covered the various similarities and differences between npm and Yarn, but we have not yet determined which one is better and which one should we choose. As always, the answer depends on our desires and needs.
As a general guide, I summarize the following suggestions:
If you still have a hard time making a clear decision between npm and Yarn, then you can check pnpm, which tries to combine the advantages of these two package managers and is the third largest giant in the package management pool.
Yarn vs. npm: Conclusion
We have learned about the importance of package managers for modern web development and we compare two of the most popular competitors on the market. They all have their own advantages and disadvantages, and in order to choose the one that suits you best, you need to have a clear understanding of your needs. The best way to decide which one is better for you is to try both and see which one performs better.
Lastly, don't overthink. Just select one and go to the fun part: Create a great app!
FAQs about Yarn vs. npm
Yarn and npm are both package managers for JavaScript, but they have some key differences. Yarn is developed by Facebook and aims to address some of the shortcomings of npm. It provides higher speed, better security, and more reliable dependency management. On the other hand, npm is the default package manager for Node.js, with a larger user base. It is also easier to use by beginners due to its simpler syntax.
Yes, Yarn is usually faster than npm. This is because Yarn parallel installation packages, which greatly speeds up the installation process. On the other hand, npm installs packages in sequence, which may be slower.
Yarn has a feature called checksum that verifies its integrity before executing the installed package's code. This adds an extra layer of security that npm does not have. However, npm has made significant improvements to its security features in recent releases.
While technically it is possible to use both Yarn and npm in the same project, this is not recommended. This is because Yarn and npm handle dependencies differently, which can lead to inconsistencies and errors in the project.
Yarn uses lock files to lock versions of project dependencies. This ensures that on all machines, every installation produces the exact same folder structure in node_modules. npm also uses locked files, but it is not as strict as Yarn .
Yarn is generally considered more reliable than npm due to its strict file locking and checksum capabilities. However, npm has made significant improvements in reliability in recent releases.
Npm has a larger community and more available packages due to its longer existence. However, Yarn is becoming more and more popular and has a growing community.
Some of the challenges of switching from npm to Yarn include learning new syntax, migrating existing projects, and adapting to Yarn's strict dependency management.
Yarn's syntax is slightly different from that of npm. For example, to use the Yarn installation package, you can use the command "yarn add" and with npm, you can use "npm install".
Num is often considered easier for beginners to use due to its simpler syntax and larger community. However, Yarn offers more advanced features and is a great choice for more experienced developers.
The above is the detailed content of Yarn vs npm: Everything You Need to Know. For more information, please follow other related articles on the PHP Chinese website!