oblador / react-native-esbuild

Fast bundler and dev server for react-native using esbuild
MIT License
595 stars 11 forks source link

Hermes is now the default, does that make this project defunct? #22

Open evelant opened 2 years ago

evelant commented 2 years ago

Is it possible to make this project work with hermes? Now that hermes is the default js engine for react-native not many people will be able to use this project going forward.

oblador commented 2 years ago

You can still opt out of hermes if you want, which is still significantly slower in runtime performance in my testing. The main problem with hermes is that it doesn't support basic ES6 syntax like block level scoping (let/const). What's worse is that hermes actually supports the let/const keywords but doesn't respect the meaning of them, leading to really bad and sometimes subtle bugs due to scope hosting. While it's possible to transpile that code with babel, it also removes most of the performance benefits with using esbuild.

Me and others have raised issues in the hermes repo. I have asked in an internal discord channel and offered engineers from my company to take over the branch that is said to exist, but got no reply. Last week I also raised it with the always helpful @cortinico during the Core Contributor Summit, let's see where that lands. I also talked to members of the metro team, but my impression is they are not really aware of the performance issues they are having as their primary reference is webpack, not esbuild/swc, and that some issues stem from watchman which is not in their scope/expertise. I think the fundamental issue is that the main author of hermes is no longer at meta, and that they don't see how it directly benefits their use case (to which I might object to as it should reduce bundle sizes and build times).

Hermes does have a very nice reduction of TTI in most cases thanks to being able to skip the parse step in production, but at this point I'm looking into other alternatives that seem more long term viable such as V8 with possibility of similar performance gains (and with good runtime perf + a modern feature set). I'd recommend to watch this talk: https://www.youtube.com/watch?v=6e0b2O6NRz4

evelant commented 2 years ago

Thanks for the thorough explanation!

It seems an unfortunate situation that Facebook is so reluctant to engage with community concerns and contributions in hermes/metro. Working with metro alongside shared code that uses modern build tools has been an exercise in frustration, especially now that more high profile modules are going ESM only. 🤷

I'll definitely look into using v8 since android perf is the primary concern anyway, iOS has always been plenty fast with JSC.

evelant commented 2 years ago

@oblador It looks like the react-native team's "solution" to the lack of block scoping in hermes is to transpile it away with babel. metro-react-native-babel-preset uses babel-plugin-transform-block-scoping. That must be why everything doesn't blow up immediately in default RN config. Still baffling to me why the hermes team would allow let/const while obviously violating their semantics. I can't imagine what possible purpose that could have, it's (very bad) incorrect behavior at runtime.

cortinico commented 2 years ago

The Hermes team has a roadmap file where you can see which features are currently supported and which one are in progress: https://github.com/facebook/hermes/blob/main/doc/Features.md#planned Some of those features got recently released in the latest versions of React Native (e.g. Intl support for iOS).

As for the let and const (block scoped variables, with support for the temporal dead zone) it's marked as planned so we're aware of this. Thanks for voicing your concerns.

What's worse is that hermes actually supports the let/const keywords but doesn't respect the meaning of them, leading to really bad and sometimes subtle bugs due to scope hosting

Yeah agree that this is suboptimal. Hopefully with official support for block scoping this will be solved.

As a rule of thumb also, keeping conversations under the facebook/hermes repo results in better visiblity as those comments are router directly to the Hermes team.

oblador commented 2 years ago

@cortinico Actually it was moved from In Progress to Planned 3 months ago. Did you check with the team directly?

cortinico commented 2 years ago

Did you check with the team directly?

Yes I did. I would suggest you ask specifically "why feature xyz was moved from In Progress to Planned" in the Hermes repo to get a more exhaustive response 👍

ianjsikes commented 1 year ago

FYI, it looks like block scoping is coming in the next Hermes major version (source), so there may be hope yet.

leegeunhyeok commented 1 year ago

I'm also working on an Esbuild based bundler for React Native. It provides a custom development server and CLI(Debug and release build tested).

The difference with this project is that it supports both JSC and Hermes runtimes. Currently, I'm implementing HMR and hope to release it soon.

If you're interested, check out the repository :)