| title | datePublished | cuid | slug | cover | tags |
|---|---|---|---|---|---|
State Of Npm 2023: Most Popular & Best Quality Packages |
Mon Aug 14 2023 13:47:54 GMT+0000 (Coordinated Universal Time) |
cllaxjien000h0amk6sk7gnt3 |
state-of-npm-2023-most-popular-best-quality-packages |
statistics, javascript, npm |
In the vast landscape of software development, one name has become synonymous with the JavaScript ecosystem: npm.
As the package manager of choice for millions of developers worldwide, npm has played a pivotal role in revolutionizing the way we build and share JavaScript code. With its expansive registry housing an ever-growing collection of packages, npm has become an indispensable tool, fueling innovation and empowering developers to create remarkable applications with ease.
In this series, the Sandworm team delves deep into the current state of npm, unearthing fascinating statistics and unveiling intriguing facts about the registry. From the sheer magnitude of packages to the most popular libraries, we'll explore the inner workings of this powerhouse that fuels the JavaScript community. Join us as we take a closer look at the state of npm and gain insights into the trends, patterns, and vibrant ecosystem that lie within.
The popularity, quality, and maintenance ratings are metrics provided by the npm registry to help users assess the characteristics and reliability of a package. These ratings are based on various factors and community feedback. Here's an overview of each rating:
-
Popularity Rating: The popularity rating indicates the relative popularity of a package within the npm ecosystem. It reflects how widely a package is being used and how frequently it is downloaded. The popularity rating considers metrics such as download counts, GitHub stars, and user reviews.
-
Quality Rating: The quality rating assesses the overall quality and stability of a package. It takes into account factors like code maintainability, adherence to best practices, code complexity, test coverage, and vulnerability disclosures. The rating is influenced by automated tools and manual reviews.
-
Maintenance Rating: The maintenance rating reflects the activity and responsiveness of the package's maintainers. It considers factors such as the frequency of updates, the resolution of reported issues, and the speed of merging pull requests. A high maintenance rating indicates an active and engaged maintenance team.
It's important to note that these ratings are calculated based on data and feedback available in the npm registry, as well as external sources such as GitHub. The specific algorithms and weightings used to calculate the ratings are not publicly disclosed by npm. Users have called for more transparency and consistency regarding these algorithms - see the discussion below:
%[https://github.com/npm/feedback/discussions/66]
The ratings are designed to provide users with a quick assessment of a package's characteristics, but they should be considered alongside other factors like documentation, community support, and personal requirements.
![](https://cdn.hashnode.com/res/hashnode/image/upload/v1688077390077/8395e6f9-e123-4936-8f4f-62eb48ab5e51.png align="center")
When searching for packages on npm, you can find the popularity, quality, and maintenance ratings displayed alongside each package in the search results or on the package's details page. These ratings can help you gauge the general trustworthiness and reliability of a package before deciding to use it in your project.
-
Npm's popularity rating is most likely calculated using a weighted formula that takes into account the following factors:
-
Downloads: The number of downloads is a measure of how many people are using a package. However, it is important to note that not all downloads are created equal. For example, a package that is used by a large enterprise with many developers will likely have more downloads than a package that is used by a small team of developers.
-
Dependents: The number of dependents is a measure of how many other packages rely on a package. This is a good indicator of how important a package is to the overall ecosystem.
-
Stars: The number of stars is a measure of how popular a package is among the NPM community. This is a good indicator of how well-liked a package is.
-
Last updated: The date the package was last updated is a measure of how active the development team is. Packages that are frequently updated are more likely to be up-to-date with the latest security patches and features.
-
-
The total number of downloads seems to be the most significant factor since almost all of the top popular packages in the registry are also old (created ten years ago or more).
-
The vast majority of packages - 2.1M, or 63% of all packages in the registry - are in the lowest popularity bracket (
0 <= popularity < 0.1). -
Only 12 packages have
popularity > 0.9.
%[https://datawrapper.dwcdn.net/ZaVsP/1/]
<iframe id="datawrapper-chart-aChkC" src="https://datawrapper.dwcdn.net/aChkC/1/" style="width:0;min-width:100%;border:none" height="953"></iframe>%[https://sandworm.dev/npm/package/chalk/5.3.0]
Chalk is a package for Node that provides an easy way to style and colorize text in the terminal. It allows you to add various colors, styles (e.g., bold, italic), and background colors to your console output, making it more visually appealing and easier to read.
Key features and usage examples of the "chalk" module include:
-
Applying colors to text using predefined color names or RGB values. You can choose from a wide range of colors such as red, green, yellow, blue, magenta, cyan, white, and more.
-
Adding text styles such as bold, italic, underline, and strikethrough to emphasize or decorate your output.
-
Setting background colors behind the text to create visually distinct sections.
-
Composing styles by chaining the methods together to create complex styles and combinations.
-
Creating custom themes by defining your own color and style combinations for consistent styling throughout your application.
const chalk = require('chalk');
console.log(chalk.red('Error:'), chalk.bold('Something went wrong!'));
console.log(chalk.yellow.bgBlue('Warning:'), 'This action may have consequences.');
console.log(chalk.cyan.underline('Info:'), 'Please note the following details.');%[https://sandworm.dev/npm/package/commander/11.0.0]
Commander is a popular framework for building command-line interfaces (CLIs) in Node. It provides a set of features and utilities that simplify the process of creating robust and user-friendly command-line applications.
// Import the commander module
const { program } = require('commander');
// Define the command and option
program
.version('1.0.0')
.command('greet <name>')
.description('Greet a person')
.option('-t, --times <count>', 'Number of times to greet', parseInt)
.action((name, options) => {
const count = options.times || 1;
for (let i = 0; i < count; i++) {
console.log(`Hello, ${name}!`);
}
});
// Parse the command-line arguments
program.parse(process.argv);-
Npm's quality rating is calculated using a weighted formula that takes into account the following factors:
-
README: A README file is essential for any package that is intended to be used by other developers. It should provide clear instructions on how to install, use, and configure the package. Packages without a README file are not likely to be considered high quality.
-
License: A license is important for ensuring that the package can be used and distributed freely. Packages without a license may be subject to copyright or patent restrictions.
-
Stability: A stable package is unlikely to change in a way that breaks its functionality. Packages that are still in development or that are frequently updated are more likely to be unstable.
-
Tests: Tests are essential for ensuring that a package works as expected. Packages without tests are more likely to contain bugs.
-
Coverage: Code coverage is a measure of how much of a package's code is covered by tests. Packages with high code coverage are more likely to be free of bugs.
-
Outdated dependencies: Outdated dependencies may contain security vulnerabilities. Packages with outdated dependencies are more likely to be insecure.
-
Vulnerabilities: Security vulnerabilities are a serious problem that can compromise the integrity of a package. Packages with known security vulnerabilities should not be used.
-
Custom website: A custom website is a good way for package authors to provide additional documentation and support for their packages. Packages without a custom website may be less well-supported.
-
-
Most packages (around 800k) are in the middle quality rating bracket (
0.5 <= quality < 0.51). -
801 packages currently hold the highest possible quality rating.
-
970 packages currently have a quality rating of zero.
%[https://datawrapper.dwcdn.net/EsPM5/1/]
<iframe id="datawrapper-chart-AluDZ" src="https://datawrapper.dwcdn.net/AluDZ/1/" style="width:0;min-width:100%;border:none" height="1052"></iframe>%[https://sandworm.dev/npm/package/hammerjs]
HammerJS is an open-source JavaScript library that provides a cross-platform abstraction for touch events. It can be used to detect and handle a variety of touch gestures, such as taps, swipes, and drags. HammerJS is easy to use and can be integrated with any JavaScript framework.
import Hammer from 'hammerjs';
const element = document.getElementById('my-element');
const hammer = new Hammer(element);
hammer.on('tap', (event) => {
console.log('The element was tapped');
});%[https://sandworm.dev/npm/package/react-popper]
React-popper is an open-source JavaScript library that provides a React wrapper for Popper.js. Popper.js is a positioning engine that can be used to position elements relative to other elements. React-popper makes it easy to use Popper.js in React projects.
Here is a simple example of how to use react-popper to position a tooltip:
import React, { useState } from 'react';
import ReactDOM from 'react-dom';
import Popper from 'popper.js';
import ReactPopper from 'react-popper';
function App() {
const [open, setOpen] = useState(false);
const tooltip = (
<div>This is a tooltip</div>
);
return (
<div>
<button onClick={() => setOpen(true)}>Open tooltip</button>
{open && (
<ReactPopper
target={document.getElementById('target')}
popper={tooltip}
/>
)}
</div>
);
}
const rootElement = document.getElementById('root');
ReactDOM.render(<App />, rootElement);-
We assume npm calculates its maintenance rating for packages based on several factors, including:
-
Version release cadence: npm assigns more weight to packages that are frequently updated with new versions. This is because new versions often include bug fixes and security updates, which can help to ensure that the package is stable and secure.
-
Repository activity: npm also considers the activity in the package's repository when calculating its maintenance rating. A repository with regular commits and pull requests is generally considered to be more active and therefore more likely to be well-maintained.
-
Issue and security vulnerability activity: npm also considers the number of open issues and security vulnerabilities in a package's repository when calculating its maintenance rating. A package with a history of open issues and security vulnerabilities is generally considered to be less well-maintained than a package with a clean record.
-
Dependents: Finally, npm considers the number of other packages that depend on a given package when calculating its maintenance rating. Packages that are used by a large number of other packages are generally considered to be more important and therefore more likely to be well-maintained.
-
-
There are only four packages in the entire registry with maintenance ratings greater than 0.33.
-
The vast majority of packages (around 1.1M) have a maintenance rating equal to 0.33, with two other notable spikes at rating values 1 and 6.
%[https://datawrapper.dwcdn.net/0K2G6/1/]
<iframe id="datawrapper-chart-FoOxP" src="https://datawrapper.dwcdn.net/FoOxP/1/" style="width:0;min-width:100%;border:none" height="1085"></iframe>%[https://sandworm.dev/npm/package/pbplus-member-sdk]
This package seems to be a client for a "PBPlus member plugin" that was last published six years ago. It's not clear if this still works, how to use it, or why it has been awarded such a high maintenance score from npm.
%[https://sandworm.dev/npm/package/@slup/icons]
This package contains the icons provided by Material Design which are part of a bigger ecosystem called Slup. It builds a tree of compiled small icon files, representing the original set forked from the Google Material Design Icons repo, in a friendly, importable and Inferno-based package.
import Menu from '@slup/icons/navigation/menu'
export const MenuIcon = () => <Menu />If you enjoyed this article, have a look at Sandworm to keep your JavaScript project safe! 👇
%[https://sandworm.dev?utm_source=blog&utm_medium=article-footer&utm_id=blog]
Sandworm Audit is the open-source
npm auditthat doesn’t suck: it checks for multiple types of issues, like vulnerabilities or license compliance, it outputs SVG charts and CSVs, it can mark issues as resolved, and you can also run it in your CI to enforce security rules. Check the docs andnpx @sandworm/audit@latestin your JavaScript app’s root to try it out 🪱.