React Native: What is the difference between React.memo and useMemo in performance optimization?

React.memo — component re-render control. useMemo — value computation caching.

React.memo:

• Wraps a component.
• Prevents re-render if props unchanged.
• Shallow comparison.

1const ExpensiveComponent = React.memo(({ data, onPress }) => {
2  console.log("Render");
3  return (
4    <TouchableOpacity onPress={onPress}>
5      <Text>{data.name}</Text>
6    </TouchableOpacity>
7  );
8});

useMemo:

• Memoizes a value.
• Recalculates on dependency change.
• Reduces computation.

1const sortedItems = useMemo(() => {
2  return items.sort((a, b) => a.name.localeCompare(b.name));
3}, [items]);

When to use:

• React.memo — expensive child components.
• useMemo — expensive computations.

Anti-pattern:

• Using both everywhere.
• Memoizing cheap computations.