How to catch perf regressions due to compiler bailouts?

[aeharding]

Hi!

I am starting to remove useCallback and useMemo from compiled components in my codebase for code readability.

However, I want to make sure that the component is always compiled and the compiler won't bailout in the future (which could cause performance regressions).

Is there a way to enforce compilation (and throw error if not compileable)? We have "use no memo"; - perhaps we need "use memo"; which won't do anything except tell the linter to enable all error severity warnings for the component?

[slorber]

Probably not what you ask for but there's a test tool to assert React re-renders: https://github.com/callstack/reassure

[poteto]

At the moment there's no good way, but I think your suggestion to make "use memo" force a component to be compiled or error could be something we consider.

[gaearon]

I wonder if we could snapshot a list of optimized components and make that a commit hook. Would make regressions noticeable and trackable.

[blazejkustra]

We implemented a similar mechanism at Expensify, it wasn't a commit hook but a workflow that run on every PR. Here is a basic implementation. For context, we don't use it anymore as it slowed down the development and we weren't actively migrating our codebase to be compatible with the react-compiler.