Wrangler: esbuild as alternative bundler?

[tmikaeld]

💡 Feature request

See: https://github.com/evanw/esbuild

Bundling even a large app with esbuild takes milliseconds, compared to minutes with any other.

Size is comparable or smaller than Webpack.

Overview and problem statement

Webpack bundling takes too long.

Basic example

From esbuild repo:

My own tests

I successfully bundled a large worker worker (628kb fully minified) and it passes all of my native Worker tests (100% coverage), the same script is 613kb in Webpack.

[xtuc]

Thanks for mentioning that.

I personally have no trust in the micro-benchmarks they are advertising. It doesn't show various JavaScript features or webpack's caching.
Do you know if esbuild supports WebAssembly in some way or can target a service worker?

[tmikaeld]

During my own tests I used these Webpack settings (Mode: production):

    minimizer: [new TerserPlugin({
      cache: true,
      parallel: 8,
      sourceMap: false,
      terserOptions: {
        mangle: true,
        keep_fnames: false,
        compress: {
          drop_console: true,
        },
        output: {
          comments: false,
        },
      },
    })],
  }

Webpack then takes 3.1 Seconds.
esbuild takes 51ms.

I don't use WebAssembly myself, so open an issue and check if he/she's interested.

[tomByrer]

I looked at esbuild, & could not get it to work for me out of the box for 1 project, but I didn't not test beyond that since:
author said esbuild is totally unsupported.

If someone would fully support it, I'd love for it to be in my business' build chain in say 6 months. Otherwise, I'd rather get Webpack get faster, use Rollup instead, etc.

[tomByrer]

Microbundler is another builder that has some usage & maturity: I'd likely would prefer this over Webpack, since Worker code tends to be smaller & focused anyhow, using more modern best practices, which seems to negate most of Webpack use-cases?

https://github.com/developit/microbundle

[xtuc]

@tomByrer again, microbundle needs to be able to target service worker (or similar) and support for loading a wasm module or plugins in order to do it.

[fusionstrings]

...and to my surprise no one mentioned https://github.com/rollup/rollup. I understand it's not as versatile as webpack but then many are in compatible codebase. I for one.

[tmikaeld]

esbuild was suggested because it is +75x faster than the fastest alternative bundler.

Other than esbuild, I don't see any other reason to switch from Webpack, since Webpack is extremely reliable and supported commercially.

I understand that Commercial support is important, but since esbuild is licensed as MIT; Cloudflare could probably hire the developer or fork it and maintain it themselves, they can surely afford to.

Considering that a single person built this and it passes all of my code coverage and unit tests with a large worker, It's a very impressive feat. I'm sure there are edge cases that require plugins/extensions, then those can be added for those cases.

[fusionstrings]

That totally makes sense @tmikaeld

[tomByrer]

Cloudflare could probably hire the developer or fork it and maintain it themselves

I figured that was your angle. Even though GoLang is a fav language for Cloudflare, seems Rust is for the worker department, so these bundlers might be better suggestions?
https://github.com/nathan/pax
https://github.com/packem/packem

Either way, I agree that Webpack is slow & perhaps overkill for most usecases.
However, Webpack v5 is likely to be faster, due to "Concatented modules are persistent cacheable" & "Separate files are created when cache items are unused or unchanged".

Perhaps someone would like to experiment using Webpack v5-beta with wrangler?

[ashleygwilliams]

i am definitely excited about improving build times, but adding an supported/maintained dependency is out of the question for us. i dont think my team is in a position to pick up the maintenance, but if one day esbuild finds some more stability i'd be excited to check it out!

[ashleygwilliams]

and to add, webpack v5 is def on our radar, but again- we'll wait til it's stable to migrate :)

[dtruffaut]

esbuild proven to me to be the only builder up-to-date on the latest ES2020 / ESNext features such ??= and consors (primary objective), while still achieving decent build times (secondary objective).

See also:

Rollup and Terser not able to catch ES2020
(So I switched to esbuild, as part of my custom build process - doing lots of optimizations aside, like custom importMaps)
https://github.com/terser/terser/issues/794#issuecomment-675727716

I don't want webpack on CloudFlare workers
(Because it results in an ugly ES5 with no dynamic import in the built bundle)
https://community.cloudflare.com/t/custom-ts-build-i-dont-want-webpack/200989/12