Использование es-toolkit для повседневных JavaScript-утилит

Если вы когда-либо обращались к Lodash, чтобы реализовать debounce для поля ввода, разбить массив на части или выбрать ключи из объекта, то вы уже знаете ценность хорошо спроектированной библиотеки JavaScript-утилит. Сегодня стоит задаться вопросом: остаётся ли Lodash правильным выбором по умолчанию, или более лёгкая альтернатива лучше подойдёт для современных проектов на TypeScript и ESM?

es-toolkit — это активно поддерживаемая библиотека JavaScript-утилит, созданная с нуля с учётом TypeScript, ESM и современных JavaScript API. Она охватывает вспомогательные функции, к которым frontend-разработчики обращаются чаще всего, и делает это с заметно меньшим размером, чем Lodash.

Что такое es-toolkit и почему это важно?

es-toolkit — это современная библиотека JavaScript-утилит, которая предоставляет типизированные, поддающиеся tree-shaking реализации распространённых вспомогательных функций. Она написана полностью на TypeScript, поставляется с собственными определениями типов и не требует отдельного пакета @types/.

Как отмечается в документации es-toolkit, библиотека уже используется в проектах и экосистемах, включая Storybook, Recharts, CKEditor, Material UI и Nuxt. Такой уровень принятия — хороший показатель того, что проект активно поддерживается и подходит для использования в продакшене.

Библиотека организована по чётким категориям — утилиты для массивов, объектов, функций, строк, математики и асинхронных операций — каждая в своём собственном модуле. Такая структура упрощает tree-shaking с любым современным сборщиком.

Повседневные вспомогательные функции

Вот практический обзор того, какие утилиты es-toolkit обрабатывает хорошо:

Утилиты для массивов

import { chunk, groupBy, uniq, difference } from 'es-toolkit';

chunk([1, 2, 3, 4, 5], 2);                          // [[1, 2], [3, 4], [5]]
groupBy(['one', 'two', 'three'], (s) => s.length);  // { 3: ['one', 'two'], 5: ['three'] }
uniq([1, 2, 2, 3]);                                 // [1, 2, 3]
difference([1, 2, 3], [2, 3]);                      // [1]

Утилиты для объектов

import { pick, omit, mapValues } from 'es-toolkit';

pick({ a: 1, b: 2, c: 3 }, ['a', 'c']);    // { a: 1, c: 3 }
omit({ a: 1, b: 2, c: 3 }, ['b']);         // { a: 1, c: 3 }
mapValues({ a: 1, b: 2 }, (v) => v * 2);   // { a: 2, b: 4 }

Утилиты для функций

import { debounce, throttle, once } from 'es-toolkit';

const handleSearch = debounce((query: string) => fetchResults(query), 300);
const handleScroll = throttle(() => updatePosition(), 100);
const initialize = once(() => setupApp());

Проверка на null и type guards

import { isNotNil } from 'es-toolkit';

const values = [1, null, 2, undefined, 3];
values.filter(isNotNil); // [1, 2, 3] — типизировано как number[]

TypeScript здесь корректно выводит сужённый тип — то, что в случае с Lodash и @types/lodash требует больше ручных усилий.

Размер бандла: практическая разница

Когда вы импортируете отдельную функцию из es-toolkit в проекте на Vite, в бандл включается только код этой функции. В зависимости от утилиты, добавляемый размер бандла может быть чрезвычайно мал по сравнению с эквивалентными импортами из Lodash.

Разница наиболее заметна, когда вы импортируете весь пакет lodash без tree-shaking, что может добавить более 20 КБ в сжатом виде.

Эта разница имеет наибольшее значение для клиентского JavaScript, где размер бандла напрямую влияет на время загрузки и Core Web Vitals.

Миграция с Lodash

Если вы переносите существующую кодовую базу, es-toolkit предоставляет слой совместимости:

// До
import _ from 'lodash';

// После (режим совместимости)
import _ from 'es-toolkit/compat';

es-toolkit/compat тестируется на собственном тестовом наборе Lodash и нацелен на полную совместимость с Lodash. Тем не менее, стандартный пакет es-toolkit — лучший выбор в долгосрочной перспективе: он меньше, быстрее, а типы TypeScript более строгие.

У стандартного пакета также меньшая и более современная API-поверхность по сравнению с Lodash, поэтому перед крупными миграциями всё же стоит ознакомиться с официальной документацией.

Когда es-toolkit имеет смысл

Используйте es-toolkit, когда:

• Вы начинаете новый проект на TypeScript или ESM и хотите типизированные утилиты без тяжёлой зависимости.
• Размер бандла имеет значение, и вы хотите чистый tree-shaking.
• Вам нужны современные асинхронные хелперы, такие как delay с поддержкой AbortController.
• Вы хотите встроенные типы без установки отдельного пакета @types/.

Оставайтесь с Lodash (или нативным JavaScript), когда:

• У вас большая существующая кодовая база на Lodash, и стоимость миграции перевешивает выгоду.
• Вы полагаетесь на специфичные для Lodash паттерны во всём старом приложении.
• Ваша среда выполнения старше современных JavaScript-инструментов.

Заключение

es-toolkit — это практичная, хорошо поддерживаемая альтернатива Lodash для современных JavaScript- и TypeScript-проектов. Она не заменит сразу все рабочие сценарии Lodash, но для новых проектов — или любой кодовой базы, где важны размер бандла и типобезопасность — её стоит рассматривать как библиотеку утилит по умолчанию.

Часто задаваемые вопросы

Understand every bug

Uncover frustrations, understand bugs and fix slowdowns like never before with OpenReplay — the open-source session replay tool for developers. Self-host it in minutes, and have complete control over your customer data. Check our GitHub repo and join the thousands of developers in our community.