Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[experiment] Use ESBuild for both TypeScript and minification #87

Open
wants to merge 1 commit into
base: main
Choose a base branch
from

Conversation

developit
Copy link
Member

@developit developit commented Aug 3, 2020

I decided to give ESBuild a try. It doesn't support transpiling to ES5 yet, so it's not going to work for the foo.legacy.js output files being generated in this PR. But it is extraordinarily fast. Production builds take under 1s on my machine and the minified sizes are pretty close to what we have with Terser.

Pros:

  • crazy fast. I'd estimate about 5x faster prod builds.
  • removes both Sucrase and Terser as deps

Cons:

  • It's a native binary, so it can't be inlined. *
  • Installation requires a direct download from the npm registry
  • The project aims to replace Rollup, not just Babel/Terser. The usage here might be too limited.

* There's a WASM version that works in Node, but it's slower than the native version (maybe that's fine?)

@developit developit added the DRAFT Draft, not ready for merging label Aug 3, 2020
@lukeed
Copy link
Member

lukeed commented Aug 3, 2020

Minified output tends to be a bit larger than terser, last I checked

@developit
Copy link
Member Author

Yeah, it's around 500b larger for the two bundles in the example.

Also since I replaced the usage of Terser with ESBuild in all build pipelines here, I've just noticed it broke the wmr.cjs single-file build.

@developit developit added the performance Performance optimizations label Nov 30, 2020
@dvdzkwsk
Copy link

Is this still being considered, or is any help needed? I've been using esbuild in plenty of my personal projects and would love to see it incorporated into build tools like yours. In fact, it was one of the first things I searched for after discovering the project :).

@developit
Copy link
Member Author

@davezuko It needs to be rebased a bit before we can do much of a comparison, and then I'd like to run it against a few development + production apps to see the impact on build and HMR times. It's a nontrivial size increase for WMR and requires a separate file (but only one), but ESbuild is also very capable. The minification is not quite as effective as Terser's in the general case, but I recall the TypeScript support is better than Sucrase's.

Another option we have would be to release this as a plugin. It could inject a rollup plugin that transforms ts(x)/js(x) and minifies bundles, and set the minify option to false to disable WMR's own minification.

@developit
Copy link
Member Author

For those interested, here's the comparison of Terser VS ESBuild from back when I did this PR:

https://gist.github.com/developit/ba6bfe0ccdb65254c850b3d3f26e938d

Base automatically changed from master to main January 22, 2021 18:07
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
DRAFT Draft, not ready for merging performance Performance optimizations
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

3 participants