Performance: Enable React Compiler

With the React Compiler, our component code is transformed at build time to automatically apply various forms of memoization. This changes the runtime semantics of our code a little bit and therefore could surface new bugs in the next release cycle in case any components fail to follow the rules of React. See https://react.dev/learn/react-compiler for more information.

This results in a small bundle size increase and modest performance gains, but I think it's worth it given the potential for larger performance gains once we tune the component structure a bit more.
This commit is contained in:
Robin
2026-08-04 12:49:53 +02:00
parent a08a577e18
commit 608695fc95
4 changed files with 65 additions and 12 deletions

View File

@@ -28,6 +28,10 @@ test("useTypedEventEmitterState reacts to events", async () => {
const emitter = new TestEmitter();
const Test: FC = () => {
// Disable the React Compiler
// https://github.com/react/react/issues/34901
"use no memo";
const value = useTypedEventEmitterState(
emitter,
"change",
@@ -51,6 +55,10 @@ test("useTypedEventEmitterState reacts to changes made by an effect mounted on t
const emitter = new TestEmitter();
const Test: FC = () => {
// Disable the React Compiler
// https://github.com/react/react/issues/34901
"use no memo";
useEffect(() => emitter.setState(2), []);
const value = useTypedEventEmitterState(
emitter,
@@ -69,6 +77,10 @@ test("useTypedEventEmitterState reacts to changes in getState", async () => {
const emitter = new TestEmitter();
const Test: FC = () => {
// Disable the React Compiler
// https://github.com/react/react/issues/34901
"use no memo";
const [fn, setFn] = useState(() => emitter.getState);
const value = useTypedEventEmitterState(emitter, "change", fn);
return (