memo
Skips re-rendering a component when its props are unchanged.
Syntax
const Memoized = memo(Component, arePropsEqual?)Parameters
| Name | Type | Required | Description |
|---|---|---|---|
Component | component | Yes | The component to memoize. |
arePropsEqual | function | No | Optional comparator (prevProps, nextProps) returning true to skip the re-render. |
Returns
component — A new memoized component that re-renders only when props change.
Examples
const Row = memo(function Row({ label }) {
return <li>{label}</li>;
});
const Item = memo(Cmp, (a, b) => a.id === b.id);
Notes
Props are compared shallowly by default. Memoization is skipped if a parent
re-renders without prop changes but passes new object, array, or function
references; stabilize those with useMemo/useCallback. State or context changes
inside the component still cause re-renders.