#esbuild — Public Fediverse posts

Почему ваш бандл тяжелее чем должен быть — тестирую tree shaking на 7 бандлерах

Вы уверены, что ваш бандлер вырезает неиспользуемый код? Я тоже был уверен — пока бандл Next.js проекта не оказался в два раза тяжелее, чем нужно. Прогнал одинаковый тест на webpack, rollup, vite, esbuild и Next.js — 5 из 7 ломаются на банальном barrel файле. Полез в исходники, нашёл основную причину — и она оказалась не там, где ожидал.

https://habr.com/ru/articles/1024404/

#tree_shaking #webpack #barrel_file #bundler #nextjs #rollup #vite #esbuild #оптимизация_бандла #фронтенд

Почему ваш бандл тяжелее чем должен быть — тестирую tree shaking на 7 бандлерах

Вы уверены, что ваш бандлер вырезает неиспользуемый код? Я тоже был уверен — пока бандл Next.js проекта не оказался в два раза тяжелее, чем нужно. Прогнал одинаковый тест на webpack, rollup, vite, esbuild и Next.js — 5 из 7 ломаются на банальном barrel файле. Полез в исходники, нашёл основную причину — и она оказалась не там, где ожидал.

https://habr.com/ru/articles/1024404/

#tree_shaking #webpack #barrel_file #bundler #nextjs #rollup #vite #esbuild #оптимизация_бандла #фронтенд

Почему ваш бандл тяжелее чем должен быть — тестирую tree shaking на 7 бандлерах

Вы уверены, что ваш бандлер вырезает неиспользуемый код? Я тоже был уверен — пока бандл Next.js проекта не оказался в два раза тяжелее, чем нужно. Прогнал одинаковый тест на webpack, rollup, vite, esbuild и Next.js — 5 из 7 ломаются на банальном barrel файле. Полез в исходники, нашёл основную причину — и она оказалась не там, где ожидал.

https://habr.com/ru/articles/1024404/

#tree_shaking #webpack #barrel_file #bundler #nextjs #rollup #vite #esbuild #оптимизация_бандла #фронтенд

Почему ваш бандл тяжелее чем должен быть — тестирую tree shaking на 7 бандлерах

Вы уверены, что ваш бандлер вырезает неиспользуемый код? Я тоже был уверен — пока бандл Next.js проекта не оказался в два раза тяжелее, чем нужно. Прогнал одинаковый тест на webpack, rollup, vite, esbuild и Next.js — 5 из 7 ломаются на банальном barrel файле. Полез в исходники, нашёл основную причину — и она оказалась не там, где ожидал.

https://habr.com/ru/articles/1024404/

#tree_shaking #webpack #barrel_file #bundler #nextjs #rollup #vite #esbuild #оптимизация_бандла #фронтенд

[Перевод] Vite 8.0: долгожданный Rolldown

13 марта 2026 года вышла новая мажорная версия инструмента для сборки фронтенд‑приложений — Vite 8. Главным изменением стал переход на новый бандлер Rolldown, написанный на Rust. Теперь Vite использует единый инструмент вместо связки esbuild и Rollup, что позволяет значительно ускорить сборку — по заявлениям разработчиков, в некоторых проектах прирост достигает 10–30 раз. Это самое значительное изменение архитектуры Vite со времени выхода Vite 2. Кроме этого, в релизе появились встроенные devtools, улучшенная поддержка TypeScript, новые возможности для SSR и ряд изменений в экосистеме плагинов. На основе поста в официальном блоге Vite 8 разберём ключевые нововведения и как они повлияют на разработку.

https://habr.com/ru/companies/first/articles/1009646/

#vite #сборщик #react #vue #voidzero #vitejs #rolldown #rollup #esbuild #nuxt

I am intrigued by workflows without bundlers, but a lot of #JavaScript dependencies need to be bundled. esm.sh had an HTTP API for bundling server side (see https://dev.to/louwers/bundling-without-a-bundler-with-esmsh-3c2k). It's defunct now.

Looking at the source code of esm.sh it just installed a bunch of user-specified npm dependencies and bundled them with #esbuild. It's complete madness that only deranged JS devs would come up with. So naturally I want to recreate it.

Here is the API documentation of @pnpm/core. Wish me luck. 🫡

The JavaScript Bundler Grand Prix, by @kateholterhoff (@redmonk):

https://redmonk.com/kholterhoff/2025/12/16/javascript-bundler-grand-prix/

#javascript #bundling #tooling #vite #bun #rolldown #webpack #rollup #parcel #esbuild #history

The JavaScript Bundler Grand Prix, by @kateholterhoff (@redmonk):

https://redmonk.com/kholterhoff/2025/12/16/javascript-bundler-grand-prix/

#javascript #bundling #tooling #vite #bun #rolldown #webpack #rollup #parcel #esbuild #history

The JavaScript Bundler Grand Prix, by @kateholterhoff (@redmonk):

https://redmonk.com/kholterhoff/2025/12/16/javascript-bundler-grand-prix/

#javascript #bundling #tooling #vite #bun #rolldown #webpack #rollup #parcel #esbuild #history

The JavaScript Bundler Grand Prix, by @kateholterhoff (@redmonk):

https://redmonk.com/kholterhoff/2025/12/16/javascript-bundler-grand-prix/

#javascript #bundling #tooling #vite #bun #rolldown #webpack #rollup #parcel #esbuild #history

The JavaScript Bundler Grand Prix, by @kateholterhoff (@redmonk):

https://redmonk.com/kholterhoff/2025/12/16/javascript-bundler-grand-prix/

#javascript #bundling #tooling #vite #bun #rolldown #webpack #rollup #parcel #esbuild #history

Note to self: #esbuild playground environment with all the settings for debugging `ngDevMode` tree shaking:

https://esbuild.github.io/try/#YgAwLjI3LjEALS1idW5kbGUKLS1taW5pZnktc3ludGF4Ci0tZm9ybWF0PWVzbQotLWRlZmluZTpuZ0Rldk1vZGU9ZmFsc2UAZQBlbnRyeS50cwA

(I find the configuration very confusing to figure out and keep struggling each time I need to do this.)

Comment utiliser **esbuild** pour packager les ressources de votre site Eleventy.

🔗 https://danburzo.ro/notes/eleventy-esbuild/

#eleventy #esbuild

Using esbuild in Eleventy, by @db:

https://danburzo.ro/notes/eleventy-esbuild/

#eleventy #esbuild

You can now load #TypeScript files with #NodeJS, but it just erases types. That means cannot load .tsx files, for example.

Luckily it is quite easy register a custom loader now. https://nodejs.org/api/module.html

Just wrote this one that uses #esbuild.

```
node --import ./tsx-loader.ts some-other-file.ts
```

#tersoftware como já falaram do hugo, eu vou trazer um beeem diferente.

O Griffin, gerador de site estático em #elixir ainda estou testando, mas é baseado no #gohugo e #11y, o que me fez considerar ele é a integração builtin com #esbuild e #tailwind

https://github.com/elixir-griffin/griffin

#tersoftware como já falaram do hugo, eu vou trazer um beeem diferente.

O Griffin, gerador de site estático em #elixir ainda estou testando, mas é baseado no #gohugo e #11y, o que me fez considerar ele é a integração builtin com #esbuild e #tailwind

https://github.com/elixir-griffin/griffin

#tersoftware como já falaram do hugo, eu vou trazer um beeem diferente.

O Griffin, gerador de site estático em #elixir ainda estou testando, mas é baseado no #gohugo e #11y, o que me fez considerar ele é a integração builtin com #esbuild e #tailwind

https://github.com/elixir-griffin/griffin

📝 esbuild's build API is pretty cool

#nix #javascript #esbuild

had some free time to mess around with esbuild for a pet project, and wrote a simple post about it :D

https://sekun.net/blog/esbuilds-build-api-is-pretty-cool/

@rauschma

I've made some tests bundle vs modules (~ 60 files) on my personal web site a year ago (sorry only in french).

Benefits of the bundle (esbuild) :

* smaller code size
* page loads faster

https://omacronides.com/notes/2024-01-11

#javascript #bundle #esbuild

🛠️ Built in #Rust, offering performance comparable to #esbuild - 10-30x faster than #Rollup

⚡ Complete plugin compatibility with existing #Vite ecosystem

🔧 Integrated support for #TypeScript, JSX transforms, and CSS bundling

🎁 Holiday Gift: #Rolldown 1.0.0-beta.1 Release After a Year of Development

#Rolldown is a next-generation #JavaScript bundler written in #Rust, designed to become the future bundling engine for #Vite. It combines the speed of #esbuild with #Rollup's flexibility.

🧵👇

#esbuild has a *nice* bonus of transpiling CSS, which will allow me to ditch the SASS dependency and write plain CSS with nested declarations.

I may still encounter issues with lib imports in my test (such as the chrome/browser specific to browser addons) but I'm confident these will be solved.

Now I "just" need to port this setup to my actual project (and surely write a blog post about this 😂)

Since I'm stubborn, I couldn't let it go. I spent more time on this yesterday evening and this morning, trying to build a very minimal project similar to mine and start the whole config from scratch: basic build, then tests, then more advanved build, then typescript.

And I got something to work. For now, my solution involves #esbuild, #typescript and #jest. With #esmodules 😍

#npm, le gestionnaire de modules un tantinet bordélique de #nodejs, a tendance à s'étaler comme un sagouin en mode YOLO.

Et on a beau avoir que 2-3 dépendances dans ses projets (#eslint, #esbuild, ...), on peut vite se retrouver avec un cache npm de plus de 1 Go...

1 PUTXXX DE GIGA. 😠

Pour des applications web qui font 50 Ko minifiées.

Donc ne pas oublier de faire #nettoyage de tant à autre :

npm cache clean --force

Je passe ainsi de 1 Go à 2.5 Mo !

#javascript #code

На минут так 15 пожалел, что продал #esbuild за кастомность бандла с моим ранее любимым #Parcel-ом. Кажется, он очень изменился...

PARCEL, ЧТО ТЫ КАЧАЕШЬ ТАМ ТАКОЕ, ЁПРСТ??? Изыди!

Как сделать один плагин сразу для всех сборщиков фронтенда?

Здравствуйте, товарищи! Сегодня мы снова поговорим про тулинг для фронтенда. В этот раз обсудим разработку плагинов для сборщиков, таких как: Webpack, Vite, esbuild и подобных. За основу мы возьмем Unplugin . Короткий ответ на вопрос из заголовка: пока никак. Чуть более длинный - изображен на обложке. А в качестве полноценного ответа, предлагаю вам эту статью. Попробуем хотя бы приблизиться к заявленному результату. Сразу стоит уточнить: это не туториал, а скорее case-study.

https://habr.com/ru/articles/856028/

#webpack #vite #rollup #mlut #atomic_css #esbuild #unplugin #плагин #tailwind #css

Как сделать один плагин сразу для всех сборщиков фронтенда?

Здравствуйте, товарищи! Сегодня мы снова поговорим про тулинг для фронтенда. В этот раз обсудим разработку плагинов для сборщиков, таких как: Webpack, Vite, esbuild и подобных. За основу мы возьмем Unplugin . Короткий ответ на вопрос из заголовка: пока никак. Чуть более длинный - изображен на обложке. А в качестве полноценного ответа, предлагаю вам эту статью. Попробуем хотя бы приблизиться к заявленному результату. Сразу стоит уточнить: это не туториал, а скорее case-study.

https://habr.com/ru/articles/856028/

#webpack #vite #rollup #mlut #atomic_css #esbuild #unplugin #плагин #tailwind #css

Как сделать один плагин сразу для всех сборщиков фронтенда?

Здравствуйте, товарищи! Сегодня мы снова поговорим про тулинг для фронтенда. В этот раз обсудим разработку плагинов для сборщиков, таких как: Webpack, Vite, esbuild и подобных. За основу мы возьмем Unplugin . Короткий ответ на вопрос из заголовка: пока никак. Чуть более длинный - изображен на обложке. А в качестве полноценного ответа, предлагаю вам эту статью. Попробуем хотя бы приблизиться к заявленному результату. Сразу стоит уточнить: это не туториал, а скорее case-study.

https://habr.com/ru/articles/856028/

#webpack #vite #rollup #mlut #atomic_css #esbuild #unplugin #плагин #tailwind #css

Как сделать один плагин сразу для всех сборщиков фронтенда?

Здравствуйте, товарищи! Сегодня мы снова поговорим про тулинг для фронтенда. В этот раз обсудим разработку плагинов для сборщиков, таких как: Webpack, Vite, esbuild и подобных. За основу мы возьмем Unplugin . Короткий ответ на вопрос из заголовка: пока никак. Чуть более длинный - изображен на обложке. А в качестве полноценного ответа, предлагаю вам эту статью. Попробуем хотя бы приблизиться к заявленному результату. Сразу стоит уточнить: это не туториал, а скорее case-study.

https://habr.com/ru/articles/856028/

#webpack #vite #rollup #mlut #atomic_css #esbuild #unplugin #плагин #tailwind #css

Uh oh… #Netlify doesn't like this new version at all… 😱

Either #esbuild fails, or the build time is too long for Netlify time limit… 😞

The build time did increase a lot compared to my previous version with Eleventy 2. But with so many changes (Eleventy version, CJS -> ESM, features moved to a plugin), difficult to know where the time really increased.

@eleventy

Hab heute versucht unser #Angular Projekt für #NativeFederation aufzusetzen. Das umstellen auf #esbuild hat immerhin geklappt. Sobald ich #NativeFederation aktiviere läufts allerdings nicht mehr. Hab aktuell auch keinen Anhaltspunkt wo das Problem liegt 🫠

Edit: Es handelt sich um eine Standalone-Anwendung.
Folgender Fehler: `ng0304: 'mat-sidenav-container' is not a known element (used in the '_a56' component template)`.

Die Komponenten sind korrekt importiert. Ohne NF klappt es.

📣 New #webdev related blog post here, introducing my take on what a #Django project template could be for an advanced usage. Obviously #astraluv is there, but also #justsystems , #esbuild , and... #SOPS 🔐

It's very early stage so please tell me what do you think about it 🙏

https://david.guillot.me/en/posts/tech/proposal-for-a-django-project-template/

[#TRADESHOW[ The 2024 #House #Design and #Technology #Exhibition is a key part of #ESBuild, focusing on the diverse needs of house users such as #elderly #care, #resort #hotels, new #rural #construction, and #private #ownership. 7.-9. August 2024. Shanghai World #Expo Exhibition & #Convention #Center, #China. https://cnbusinessforum.com/event/2024-house-design-and-technology-exhibition/

esbuild v0.22.0: es2024 target, WASI binaries and more
@evanw
https://github.com/evanw/esbuild/releases/tag/v0.22.0

#ECMAScript #JavaScript #esbuild

So Kitten’s build process (i.e., the time it takes to build Kitten itself) takes ~0.7 seconds on my ~1 year old desktop (Ryzen 7 5700G 3.8Ghz) vs ~1.4 seconds on my ~3-year-old Starlabs LabTop (renamed to the Starbook thanks to a suggestion by yours truly but sadly, not quickly enough).

So, in summary, it’s bloody fast for something that results in a ~9MB bundle.

(And that’s all thanks to esbuild.)

https://codeberg.org/kitten/app

#Kitten #SmallWeb #build #performance #web #dev #esbuild #NodeJS #JS

[Перевод] Rolldown — перспективы

Rollup - это лучший и наиболее полный сборщик на сегодняшний день. Он опередил свое время, став первопроходцем в таких ключевых концепциях, как tree shaking, и до сих пор ему нет равных в этом отношении. Когда Эван Ю представил Vite - Rollup был краеугольным камнем процесса сборки. Плагины Vite - это (по большей части) плагины Rollup.

https://habr.com/ru/articles/806351/

#rollup #webpack #bundler #node #esbuild #rolldown

So #ThingUmbrella #ReleaseMonday: Today's release is the first time all 186 packages have been built using https://esbuild.github.io instead of TypeScript's own compiler (which is now only being used when needed for type checking and to generate type declaration files). The overall output format and target (ES2022) remains the same. I've been doing extensive tests with the various bundled examples and some other of my own projects, but should you run into any unexpected issues on your end, please do report back, either here or file an issue on GitHub. 🙏

New packages: In an effort to further reduce 3rd party runtime dependencies (of which there're almost none anyway), but also to improve performance, I've recently added https://thi.ng/msgpack, a serializer/deserializer for the https://msgpack.org/ format, which I've been using for various things, incl. the https://thi.ng/umbrella repo-wide doc search index (UI & hosting location to be urgently updated/improved):

https://demo.thi.ng/umbrella/rdom-search-docs/

Also new: https://thi.ng/rdom-forms, a data-driven, declarative & extensible HTML form generator based around https://thi.ng/hiccup-html & https://thi.ng/rdom. The form elements are unstyled by default, but highly customizable. In addition to being aimed at rdom (for using reactive form field values), it's also highly suitable for static HTML-generation or SSR purposes. Check out the new example project for details (also open the dev console to view HTML output).

https://github.com/thi-ng/umbrella/tree/develop/examples/rdom-formgen

I've already started updating/simplifying the UI generation of several other example projects in the repo, but the API of this new package is still WIP only. Be warned, there might/will be changes ahead...

#ThingUmbrella #OpenSource #TypeScript #JavaScript #esbuild

Even though #ThingUmbrella isn't using a low-level language, many of its design aspects and decisions are explicitly about keeping resource usage low and being generally aware of code bundling, tree shaking (dead code elimination), CPU, energy & bandwidth consumptions... As the collection now consists of 186 libraries (with ~3850 source files!), every even minor saving in the shared build infrastructure will quickly have a positive compounding impact. Over the past month I've been busy updating & testing new tooling for the entire monorepo and am super happy to report _drastically_ reduced build & test times! "Drastically" here meaning a factor of 10-20x(!!!) faster... 🚀

Time to build & test the entire monorepo on GitHub's CI:

Previously, using only TypeScript for building & NodeJS for testing:
30-40 mins (😱)

Now, using https://esbuild.github.io for building and https://bun.sh for testing:
1:50-2 mins (🤯)

On my MBA M1 (2021) the whole process only takes now 56 seconds!

If you want to apply the same kind of optimizations for your own project, do take a look at my package.json and tsconfig.json files in this repo:

https://github.com/thi-ng/umbrella

Ps. It's also #ReleaseMonday. Details about that in a later post... 🫡

#ThingUmbrella #Optimization #CI #BuildTools #EnergyConsumption #TypeScript #esbuild #Bun #Monorepo #OpenSource #GitHub

My "Best Practices" for professional full-featured #Node / #TypeScript mono repositories. I came up with this:

https://github.com/bhouston/esbuild-ts-monorepo

Any feedback for further improvements?

#lerna #esbuild #koa

Try esbuild online
https://esbuild.github.io/try/
#ES_Next_News #ECMAScript #JavaScript #esbuild

Try esbuild online
https://esbuild.github.io/try/
#ES_Next_News #ECMAScript #JavaScript #esbuild

Try esbuild online
https://esbuild.github.io/try/
#ES_Next_News #ECMAScript #JavaScript #esbuild

Try esbuild online
https://esbuild.github.io/try/
#ES_Next_News #ECMAScript #JavaScript #esbuild

Try esbuild online
https://esbuild.github.io/try/
#ES_Next_News #ECMAScript #JavaScript #esbuild

#Development #Overviews
The most popular build tools for front-end developers in 2023 · Key features and benefits of the top build tools for web development https://ilo.im/11g6au

_____
#WebDevelopment #WebDev #Frontend #Workflow #Collaboration #Automation #Tool #BuildTool #Compiler #Bundler #TaskRunner #JavaScript #TypeScript #Esbuild #Lerna #Nx #Parcel #Rollup #Rome #SWC #Turbo #Vite #Webpack

#Development #Overviews
The most popular build tools for front-end developers in 2023 · Key features and benefits of the top build tools for web development https://ilo.im/11g6au

_____
#WebDevelopment #WebDev #Frontend #Workflow #Collaboration #Automation #Tool #BuildTool #Compiler #Bundler #TaskRunner #JavaScript #TypeScript #Esbuild #Lerna #Nx #Parcel #Rollup #Rome #SWC #Turbo #Vite #Webpack

#Development #Overviews
The most popular build tools for front-end developers in 2023 · Key features and benefits of the top build tools for web development https://ilo.im/11g6au

_____
#WebDevelopment #WebDev #Frontend #Workflow #Collaboration #Automation #Tool #BuildTool #Compiler #Bundler #TaskRunner #JavaScript #TypeScript #Esbuild #Lerna #Nx #Parcel #Rollup #Rome #SWC #Turbo #Vite #Webpack

#Development #Overviews
The most popular build tools for front-end developers in 2023 · Key features and benefits of the top build tools for web development https://ilo.im/11g6au

_____
#WebDevelopment #WebDev #Frontend #Workflow #Collaboration #Automation #Tool #BuildTool #Compiler #Bundler #TaskRunner #JavaScript #TypeScript #Esbuild #Lerna #Nx #Parcel #Rollup #Rome #SWC #Turbo #Vite #Webpack

Hmmm, what to do? I'm refactoring a webapp of mine kicking out all the old frontend stuff, but aim to keep the build tooling to a minimal. Will be going with #Tailwindcss, so that requires Node (which is fine).

But for the #javascript parts, which will be libraries such as #htmx and #hyperscript, but also #chartjs and some others. Will I add #ESBuild to handle this, use unpkg (don't want to depend on a CDN) or manually download and link in my project?