root/lamp

Files

Seven 8963f777ee Add PostCSS configuration and skills lock file

- Created a new PostCSS configuration file to integrate Tailwind CSS.
- Added a skills lock file containing various Expo skills with their respective source and computed hashes.

2026-03-09 06:41:01 +07:00

1.6 KiB

Raw Blame History

React Compiler

React Compiler is stable in Expo SDK 54 and later. It automatically memoizes components and hooks, eliminating the need for manual useMemo, useCallback, and React.memo.

Enabling React Compiler

Add to app.json:

{
  "expo": {
    "experiments": {
      "reactCompiler": true
    }
  }
}

What React Compiler Does

Automatically memoizes components and values
Eliminates unnecessary re-renders
Removes the need for manual useMemo and useCallback
Works with existing code without modifications

Cleanup After Enabling

Once React Compiler is enabled, you can remove manual memoization:

// Before (manual memoization)
const memoizedValue = useMemo(() => computeExpensive(a, b), [a, b]);
const memoizedCallback = useCallback(() => doSomething(a), [a]);
const MemoizedComponent = React.memo(MyComponent);

// After (React Compiler handles it)
const value = computeExpensive(a, b);
const callback = () => doSomething(a);
// Just use MyComponent directly

Requirements

Expo SDK 54 or later
New Architecture enabled (default in SDK 54+)

Verifying It's Working

React Compiler runs at build time. Check the Metro bundler output for compilation messages. You can also use React DevTools to verify components are being optimized.

Troubleshooting

If you encounter issues:

Ensure New Architecture is enabled
Clear Metro cache: npx expo start --clear
Check for incompatible patterns in your code (rare)

React Compiler is designed to work with idiomatic React code. If it can't safely optimize a component, it skips that component without breaking your app.

1.6 KiB Raw Blame History