Migrate Motia UI from Manual Memoization to React Compiler

[Tanmay-008]

Problem

Motia UI currently relies on manual memoization (memo, useMemo) to reduce unnecessary re-renders and keep performance stable across the UI.
While this approach works, it introduces a few issues:

1.Developers must remember to manually optimize each component

2.Memoization patterns can become inconsistent across a growing UI codebase

3.It increases maintenance effort

4.Manual optimizations can be missed or misused

5.Render performance depends heavily on developer decisions instead of a unified system

React introduced the React Compiler precisely to automate memoization and render optimization, but the earlier versions weren't stable enough for production — which is why Motia UI adopted manual memoization initially.

Now the compiler’s stable release is available and officially marked production-ready, making it a strong candidate to replace manual memoization.

Proposed Solution

Motia UI currently uses manual memoization (memo, useMemo) to manage re-renders.
Since React has now released a stable React Compiler, it could be a strong improvement because:

it automates memoization at compile-time

reduces unnecessary re-renders

improves overall performance

removes the need to manually handle memoization logic

keeps UI behavior more consistent as the codebase grows

Alternatives Considered

No response

Additional Context

Earlier React Compiler versions weren’t stable enough for production apps

The new stable version resolves these issues and is production-ready

This will help improve performance, reduce unnecessary re-renders, and eliminate the need for manual optimization

Willing to Help Implement?

• I would like to work/help with this

[rohitg00]

Thanks @Tanmay-008, I know you are working on this, but let us know if any help is required, as @riturajFi also showed interest.