炸裂!比Lodash快11倍,体积小97%!新一代JS工具库es-toolkit横空出世!

0 阅读5分钟

你是不是也受够了这些“性能刺客”?

  • 引入一个 debounce,打包体积却增加了1.4KB?
  • 想找个完美的 omit 函数,结果发现性能慢到离谱?
  • 在追求极致性能的项目里,连1KB的冗余代码都让你如坐针毡?

GitHub上杀出一匹黑马——es-toolkit
它宣称:“不是Lodash的替代品,而是JavaScript工具库的终极形态!”

结果直接封神:

  • 性能碾压Lodash 11倍omit函数每秒执行近500万次!
  • 单函数平均体积<300Bdifference函数体积仅91字节,比Lodash小97%!
  • 100% ESM + TypeScript,类型提示精准到毛孔!
  • 完美兼容Lodash!提供/compat模式,迁移成本几乎为零!

这个神级项目,名叫——es-toolkit

一、先看对比:新王登基,旧神退位!

包体积:小到离谱!

函数es-toolkitLodash-es缩减比例
sample88 bytes2000 bytes-95.6%
difference91 bytes3190 bytes-97.2%
debounce144 bytes1400 bytes-89.7%
throttle110 bytes1460 bytes-92.5%
pick657 bytes3860 bytes-83.0%

性能:快到飞起!

函数es-toolkit (ops/sec)Lodash-es (ops/sec)性能倍数
omit4,767,360403,62411.8×
pick9,121,8392,663,0723.43×
difference10,436,1015,155,6312.02×
intersection9,999,5714,630,3162.15×

没有花里胡哨的营销,只有硬核的Benchmark和Bundle Analyzer报告! es-toolkit的目标很明确:成为你项目里最轻、最快、最可靠的那1%

二、es-toolkit到底是什么?硬核拆解

一句话总结:一个由韩国顶级金融科技公司Toss打造的、面向未来的JavaScript原子化工具库。

核心理念(看懂就知道有多狠)

  • 原子化设计(Atomic Design):每个函数都是一个独立的ESM模块,无任何内部依赖。引入debounce,就只会打包debounce
  • 极致性能:通过充分利用现代 JavaScript API,部分函数甚至可以获得高达11倍的性能提升。
  • 极致精简:与Lodash等其他库相比,可以减少高达97%的包体积,其中一些实用函数的体积甚至少于100字节。

最关键:三大技术护城河

  1. 纯ESM架构:从第一天起就只为现代构建工具(Vite, Webpack 5+, Rollup)设计,彻底告别CommonJS的历史包袱。
  2. 类型即文档:内置TypeScript类型,并经过严格测试,确保了100%的测试覆盖率,以保证最大的可靠性。
  3. 现代化实现:利用最新的 JavaScript 特性,在保证功能强大的同时,实现了极致的性能和体积优化。

三、功能实测:快到离谱,小到极致

别以为小就没功能!es-toolkit覆盖了数组、函数、数学、对象、字符串等所有常用场景:

debounce / throttle:防抖节流,体积仅100多字节,性能提升近90%!

pick / omit:对象属性筛选,omit性能是Lodash的11倍!

difference / intersection:数组差集交集,体积小97%,速度快2倍!

isNotNil / isPlainObject:精准的类型守卫,让TypeScript体验更上一层楼。

实战代码:Vue 3 + es-toolkit

<script setup lang="ts">
// 只打包这一个函数,体积增加144字节!
import { debounce } from 'es-toolkit';
// 对象操作,性能提升11倍!
import { omit } from 'es-toolkit';

const onInput = debounce((e: Event) => {
  // 处理输入...
}, 300);

const cleanUser = omit(user, ['password', 'token']);
</script>

体验如何? 丝滑、精准、毫无负担!

四、无缝迁移:Lodash用户福音

担心API不兼容?完全不必! es-toolkit提供了 es-toolkit/compat 兼容层,目标是提供与lodash百分之百的功能兼容性。

// 迁移前 (Lodash)
import { chunk, debounce } from 'lodash-es';

// 迁移后 (es-toolkit)
import { chunk, debounce } from 'es-toolkit/compat';
  • 全面测试/compat 模块已经对 lodash 的实际测试用例进行了全面测试。
  • 平滑过渡:一旦迁移完成,你可以逐步替换回原始的 es-toolkit 以获得最佳性能。

这意味着,你可以零风险、低成本地享受到es-toolkit带来的性能和体积红利!

五、为什么能这么快、这么小?

答案就在它的基因里:

  • 现代化的实现:es-toolkit不是对旧库的简单重写,而是站在现代JS引擎的肩膀上,重新思考每一个算法和API的设计。
  • 无历史包袱:它不兼容IE,不支持过时的API,只专注于为现代Web应用提供最高效的解决方案。
  • 社区驱动:作为开源项目,它吸引了全球顶尖开发者的贡献,持续保持技术领先。

简单说:它把每一个字节和每一次CPU周期都当成了自己的孩子,绝不浪费

六、这不仅是工具,更是未来

es-toolkit真正的价值
它代表了一种新的开发哲学——对性能和简洁性的极致追求

  • 对个人开发者:让你的代码更优雅,项目更轻盈。
  • 对企业:在微前端、低带宽等场景下,每一KB的节省都意味着真金白银的成本降低和用户体验的提升。
  • 对整个生态:推动工具库从“大而全”向“精而美”演进。

最后

当你的同事还在为打包体积焦头烂额时,你已经用es-toolkit将项目瘦身了90%; 当你的对手还在为性能瓶颈寻找解决方案时,你已经用一行代码实现了11倍的性能飞跃。

这就是掌握es-toolkit的力量

未来已来,只是尚未流行。现在入局,你就是下一代高性能Web应用的先行者。

项目地址github.com/toss/es-too…
中文文档www.es-toolkit.cn/

你在项目里最想用es-toolkit替换掉哪个Lodash函数?评论区聊聊


各位互联网搭子,要是这篇文章成功引起了你的注意,别犹豫,关注、点赞、评论、分享走一波,让我们把这份默契延续下去,一起在知识的海洋里乘风破浪!