esbuild и Turbopack
Сборщики нового поколения -- на порядок быстрее Webpack за счёт нативных языков (Go, Rust).
Зачем нужно
- Мгновенная сборка (esbuild в 10-100x быстрее Webpack)
- Быстрый HMR (Hot Module Replacement)
- Используются под капотом Vite и Next.js
Где используется
- esbuild: движок Vite, самостоятельный бандлер
- Turbopack: встроен в Next.js (замена Webpack)
esbuild
Почему быстрый
- Написан на Go (компилируемый, параллелизм)
- Минимум проходов по AST
- Всё в памяти, без промежуточных файлов
Использование
npm i -D esbuild
# CLI
npx esbuild src/index.ts --bundle --outfile=dist/app.js --minify
# С JSX
npx esbuild src/app.tsx --bundle --loader:.tsx=tsx --outfile=dist/app.js
API
import * as esbuild from 'esbuild';
await esbuild.build({
entryPoints: ['src/index.ts'],
bundle: true,
minify: true,
sourcemap: true,
outfile: 'dist/app.js',
target: ['es2020'],
});
Turbopack
Почему быстрый
- Написан на Rust (Vercel/Next.js команда)
- Инкрементальная сборка (пересобирает только изменённое)
- Ленивая компиляция (собирает только то, что запрошено)
Использование в Next.js
next dev --turbopack
Никакой дополнительной настройки -- Turbopack читает next.config.js.
Сравнение
| Параметр | esbuild | Turbopack | Webpack |
|---|---|---|---|
| Язык | Go | Rust | JS |
| Dev-скорость | Очень быстрый | Очень быстрый | Медленный |
| Экосистема | Средняя | Next.js only | Огромная |
| Плагины | Ограничены | Ограничены | Тысячи |