webpack VS esbuild

Compare webpack vs esbuild and see what are their differences.

webpack

A bundler for javascript and friends. Packs many modules into a few bundled assets. Code Splitting allows for loading parts of the application on demand. Through "loaders", modules can be CommonJs, AMD, ES6 modules, CSS, Images, JSON, Coffeescript, LESS, ... and your custom stuff. (by webpack)
Our great sponsors
  • Klotho - AWS Cloud-aware infrastructure-from-code toolbox [NEW]
  • Appwrite - The Open Source Firebase alternative introduces iOS support
  • InfluxDB - Access the most powerful time series database as a service
  • Sonar - Write Clean JavaScript Code. Always.
webpack esbuild
295 302
63,096 35,403
0.1% -
9.9 9.7
6 days ago 4 days ago
JavaScript Go
MIT License MIT License
The number of mentions indicates the total number of mentions that we've tracked plus the number of user suggested alternatives.
Stars - the number of stars that a project has on GitHub. Growth - month over month growth in stars.
Activity is a relative number indicating how actively a project is being developed. Recent commits have higher weight than older ones.
For example, an activity of 9.0 indicates that a project is amongst the top 10% of the most actively developed projects that we are tracking.

webpack

Posts with mentions or reviews of webpack. We have used some of these posts to build our list of alternatives and similar projects. The last one was on 2023-05-17.

esbuild

Posts with mentions or reviews of esbuild. We have used some of these posts to build our list of alternatives and similar projects. The last one was on 2023-06-02.
  • Building an Extension System on the Web
    7 projects | dev.to | 2 Jun 2023
    Bundling extensions — in general, custom extension formats require custom bundling tools. Currently, as it’s still early, I put everything into a single JSON file with Node.js and esbuild bundler, but I’m exploring how to develop a custom Vite plugin for this purpose;
  • Do not drop Sass for CSS
    2 projects | dev.to | 2 Jun 2023
    Chris favours using the ESBuild bundler to work out the shortcomings. ESBuild can bundle CSS files into a single CSS file. ESBuild can transform your natively nested CSS to "flat" CSS -- this is important since nesting is not in Firefox currently. Therefore, with the aid of ESBuild, Chris has feature parity for his usage of Sass. The other Sass features like mixins and inheritance do not appeal to Chris.
  • [AskJS] Advantages of Rollup over other bundlers for creating libraries?
    3 projects | /r/javascript | 9 May 2023
    Rollup is highly configurable via plugins. It also supports a wide range of transpilation targets. However, it's written in JavaScript (well, TypeScript) so there's a ceiling on how fast it can go. esbuild and swc are orders-of-magnitude faster than Rollup.
  • JavaScript import maps are now supported cross-browser
    14 projects | news.ycombinator.com | 3 May 2023
    Note that `deno bundle` is deprecated. You can almost replace it with esbuild but it currently lacks builtin support for import maps:

        deno run --allow-all https://deno.land/x/[email protected]/mod.js --bundle app.js --outfile=bundle.js. # errors, see: https://github.com/evanw/esbuild/issues/2230
  • xtsz - a TS / JS file runner with support for HTTP/S imports
    5 projects | /r/node | 22 Apr 2023
    Want to import a package / file conveniently from esm.sh or unpkg or directly from a GitHub repo for a one-off script (for example). To do this I created a custom ESBuild plugin to handle HTTP imports - that worked for ,js files. To support running both ESM and CJS, I use tsx.
  • Let’s create a Node CLI for generating files from templates!
    6 projects | dev.to | 21 Apr 2023
    esbuild – is an easy-to-configure bundler,
  • Building a modern gRPC-powered microservice using Node.js, Typescript, and Connect
    15 projects | dev.to | 20 Apr 2023
    As we iterate on the definition, we are going to want a better developer experience for rebuilding the package on changes. Typically, for a “library” or “utility” style package, I’d reach for either unbuild’s stub concept or use esbuild/tsup/rollup to implement a more traditional watch/rebuild, but in this case, I’m watching a proto file that lives outsides of the source, which breaks assumptions of those tools.
  • Svelte frontend vs HTMX and hyperscript
    6 projects | /r/golang | 19 Apr 2023
    I use ESBuild (https://esbuild.github.io/) as a library for my almost pure Go toolchain, and it covers my requirements for almost 2 years now. ESBuild is the Go tool used in Vite, an incredible tool that I stopped using when I discovered that ESBuild covered all my needs.
  • Buildless workflow through import maps (featuring Lit, Shoelace and more)
    2 projects | dev.to | 12 Apr 2023
    As we can see, we have two external dependencies and one internal tool. In the modern way of packaging our application, we would be of course required to package this project using some bundler like ESBuild or Rollup. But with import maps, we can instead utilize CDN's to deliver our packages and completely eliminate the bundling step.
  • How are you building React applications? It's time to move on from Create React App
    13 projects | dev.to | 12 Apr 2023
    "Why?" you might ask. Vite is built on top of esbuild, a Go-based bundler for the web that is 10-100x faster than other bundlers such as webpack. Vite is also platform-agnostic, so you can learn the tool and use it for many applications.

What are some alternatives?

When comparing webpack and esbuild you can also consider the following projects:

swc - Rust-based platform for the Web

vite - Next generation frontend tooling. It's fast!

craco - Create React App Configuration Override, an easy and comprehensible configuration layer for Create React App.

Rollup - Next-generation ES module bundler

parcel - The zero configuration build tool for the web. 📦🚀

terser - 🗜 JavaScript parser, mangler and compressor toolkit for ES6+

tsup - The simplest and fastest way to bundle your TypeScript libraries.

ts-node - TypeScript execution and REPL for node.js

Tailwind CSS - A utility-first CSS framework for rapid UI development.

import-maps - How to control the behavior of JavaScript imports