facebook / react

The library for web and native user interfaces.
https://react.dev
MIT License
227.97k stars 46.53k forks source link

[Compiler Bug]: healthcheck vs eslint #29677

Open mbiggs-gresham opened 4 months ago

mbiggs-gresham commented 4 months ago

What kind of issue is this?

Link to repro

n/a

Repro steps

I've ran the healthcheck against my app which states that 72 out of 80 components have been compiled. The documentation states the higher the better. I don't have any eslint violations (there were 2 but those have been fixed). The app is working with some good improvements, so thanks!

% npx react-compiler-healthcheck@latest

Successfully compiled 72 out of 80 components.
StrictMode usage found.
Found no usage of incompatible libraries.

So how do i find the remaining components? Should there not be a minimum of 8 eslint violations or is that not how it works? What's the recommended approach to getting all 80 optimised?

How often does this bug happen?

Every time

What version of React are you using?

19.0.0-rc-38e3b23483-20240529

poteto commented 4 months ago

I'd recommend taking a look at https://github.com/reactwg/react-compiler/discussions/8 on our general recommendation for how to rollout the compiler.

Assuming you've already tested in production and now want to increase memoization, the issues that are addressable by you are reported by the eslint rule, so you can fix those if you like. The remaining are things like compiler todos, invariants, etc that are on us to implement and/or fix, so I wouldn't worry about those too much. If you really want to know what these non-addressable issues are you can add { panicThreshold: "ALL" } to your compiler config but note that this will be extremely noisy and crash the babel plugin a lot so it is not recommended to be used.