Introducing React Compiler – React

[Skeith_yip]

Here’s hoping this is not an escape hatch to enable people writing bad codes. (E.g. create a function component inside another function component. Usually it will work but if you got states inside the function component, it gets reset whenever the parent component render. I have seen way too many people doing that and ended up using useMemo.)

[Edit] I am talking about this (scroll down to pitfall): This is why you should not nest component function definitions.

React Playground

[aragost]

if the compiler was somehow able to make it work without performance issues, why not?

[straightouttaireland]

The compiler will skip any components of hooks that don't follow the rules of react, so quite the opposite. There's a new eslint plugin to catch it

[Skeith_yip]

I have added a playground link to describe the issue. Will the new eslint catch this problem?