Add an ASCII-only output mode

[koenbok]

If you build anything containing fbjs you run into an exotic regex that looks like this:

var RANGE_BY_BIDI_TYPE = {
  L:
    "A-Za-z\xAA\xB5\xBA\xC0-\xD6\xD8-\xF6\xF8-\u01BA\u01BB" +
    "\u01BC-\u01BF\u01C0-\u01C3\u01C4-\u0293\u0294\u0295-\u02AF\u02B0-\u02B8" +
   // loads more...

Which results in a broken regex if you build it with esbuild.

I made a repro here. Just run yarn build to rebuild.

[koenbok]

Thanks for the awesome project btw. It builds all of Framer in 500ms (instead of 40s with webpack/ts). We'll keep experimenting to see if we can use it in production.

[koenbok]

If you force the browser to utf-8 it does work:

<meta charset="utf-8">

[evanw]

Thanks for trying esbuild out on the Framer codebase. Feedback like this is very helpful, especially with attached repro code like this.

It builds all of Framer in 500ms (instead of 40s with webpack/ts).

Wow, that's awesome! Glad to hear it's such a big improvement. Does it actually already work for your use case? Or are there other webpack loaders that would need to work too? Do you happen to have any output size comparisons too?

If you force the browser to utf-8 it does work:

Given that this is the case, and that other minifiers such as terser do the same thing as esbuild here, I'm not sure this is a bug in esbuild. I'm deliberately using UTF-8 output to be as compact as possible since Unicode escape sequences are more verbose.

It seems reasonable to add an --ascii option for cases where it's inconvenient or not possible to serve the source code as UTF-8. That's a feature that other minifiers such as terser have. I'll use this issue to track that feature.

[evanw]

We'll keep experimenting to see if we can use it in production.

Cool! It'd be really helpful to know if this works out for you or not. Heads up that we're not using this at Figma in production yet.

Also keep in mind that esbuild's support for converting newer syntax into older syntax for older browsers (what Babel does) isn't complete yet. So it might not be ready for your use case depending on what older browsers you need to support.

If you're using newer syntax and use --target flag to set the language target to an older language target, esbuild should give you a warning if it was unable to convert something to older syntax for that language target.

[koenbok]

I’m making good progress, but have not been able to build it successfully yet. I’m running into random reference errors that I think are caused by circular imports in our code. I’ll dig a bit deeper and report back.