npm、yarn、pnpm的对比和优略

前言

作为十多年的前端老前辈,我们从node产生之初,就接触到node包的管理工具,从开始的npm、到yarn、再到现在的pnpm,这个阶段到底经历了什么?

想要搞明白这个问题,我们就要理解,node包管理的发展历程。

我们的node包管理发展过程

1、npm最初的node包管理阶段

node刚出生的时候,npm作为node包的管理工具,它还处于一个初级阶段。

它有一些特征:

  • 安装包是串行下载,也就是我们的项目中,一个一个的下载依赖包,速度很慢。
  • 在网络不稳定的情况下,下载失败需要重新下载安装
  • 缓存机制很差劲,经常下载重复的包。
  • 包的依赖,是层层嵌套,同样的依赖,在不同的包需要下载多遍。

总结一下,就是下载速度慢,缓存机制也不行,依赖关系就是简单的嵌套机制。

2、yarn的改进

npm作为最初的包管理方案,正是因为它差劲的表现,导致了需要一款工具,针对它进行改进,这个时候,yarn就诞生了。

yarn做了这样的一些优化:

  • yarn 并行下载依赖包,显著提升安装速度。
  • yarn 的包下载,支持断点续传,失败后可以从断点继续。
  • yarn 做了更智能的本地缓存,避免重复下载
  • yarn 的下载体验,在离线情况下,做了更好的优化
  • yarn 使用扁平化的依赖包管理方案,对比嵌套结构,是一种更优策略

正是这些体验的优化,让yarn迅速在前端里面火热起来。

后续,其实npm自身,也有优化改进的一个过程。分别在其后续的版本中,做了很多优化。包括:

1、把串行下载依赖包改为并行下载。

2、做了多次的缓存优化机制。

3、针对依赖解析,重写,大幅优化解析性能

4、增加了自身workspace等能力。

其实,在npm持续优化的过程中,性能上,其实已经慢慢追上了yarn的包管理方案。

3、pnpm的创新

但是,node包管理的方案,这就到头了吗?其实不然,pnpm又在这之上,做了创新性的改善,个人预计,后续的所有前端项目,都会抛弃npm、yarn,转向使用pnpm。

那pnpm做了哪些创新呢?

  1. 大幅优化磁盘空间,所有的依赖包,只需要在全局存一份。(有经验的前端小伙伴就知道,前端项目多了,光依赖包,我们可能下了有几百个G)
  2. 极致的安装速度。(使用链接的方式,而不是把包重新复制/下载)
  3. 具有一个全局存储池,存放已经下载的依赖包。通过链接方式,访问这些包。这就是pnpm的核心优势。

总结对比

特性 npm yarn pnpm
安装速度 中等 最快
磁盘使用 中等 最低
依赖隔离 中等 最强
缓存效率 中等 最好
安全性 中等 最好
兼容性 最好

我的结论

所以,当我们搞懂了这些不同的包管理工具的不同,我想,我们后续针对工具的选择,已经不用再讨论了。

pnpm --- 就是我们以后专业前端的包管理工具

结束语

前大厂前端技术专家,现大前端技术负责人,关注我,我会持续分享干货内容!

相关推荐
前端不太难3 分钟前
从 Navigation State 反推架构腐化
前端·架构·react
前端程序猿之路37 分钟前
Next.js 入门指南 - 从 Vue 角度的理解
前端·vue.js·语言模型·ai编程·入门·next.js·deepseek
大布布将军43 分钟前
⚡️ 深入数据之海:SQL 基础与 ORM 的应用
前端·数据库·经验分享·sql·程序人生·面试·改行学it
川贝枇杷膏cbppg1 小时前
Redis 的 RDB 持久化
前端·redis·bootstrap
JIngJaneIL1 小时前
基于java+ vue农产投入线上管理系统(源码+数据库+文档)
java·开发语言·前端·数据库·vue.js·spring boot
天外天-亮2 小时前
v-if、v-show、display: none、visibility: hidden区别
前端·javascript·html
jump_jump2 小时前
手写一个 Askama 模板压缩工具
前端·性能优化·rust
be or not to be2 小时前
HTML入门系列:从图片到表单,再到音视频的完整实践
前端·html·音视频
90后的晨仔3 小时前
在macOS上无缝整合:为Claude Code配置魔搭社区免费API完全指南
前端
沿着路走到底3 小时前
JS事件循环
java·前端·javascript