React.memo and useMemo in React Native - Cheat Sheet & Quick Revision

Recall & Review

beginner

What is React.memo used for in React Native?

React.memo is a higher-order component that helps prevent unnecessary re-rendering of a component by memoizing it. It only re-renders the component if its props change.

beginner

Explain useMemo hook in React Native.

useMemo is a React hook that memoizes the result of a function. It recomputes the value only when its dependencies change, helping to avoid expensive calculations on every render.

intermediate

How does React.memo differ from useMemo?

React.memo memoizes a whole component to avoid re-rendering when props are unchanged. useMemo memoizes a value or calculation inside a component to avoid recalculating it on every render.

beginner

When should you use React.memo in your React Native app?

Use React.memo when you have a functional component that renders the same output for the same props and you want to avoid unnecessary re-renders to improve performance.

intermediate

Give an example of a situation where useMemo is helpful.

useMemo is helpful when you have a heavy calculation or data processing inside a component that should only run when specific inputs change, like filtering a large list based on user input.

What does React.memo do?

A Manages component state

B Memoizes a value inside a component

C Creates a new component

D Prevents a component from re-rendering if its props haven't changed

React.memo wraps a component and skips re-rendering if the props are the same.

Which hook is used to memoize a calculation inside a component?

A useState

B useEffect

C useMemo

D useCallback

useMemo memoizes the result of a function to avoid recalculating it on every render.

When does useMemo recompute its value?

A Every time the component renders

B Only when its dependencies change

C Never

D When the component unmounts

useMemo recomputes the memoized value only when one or more dependencies change.

React.memo is best used for:

A Preventing unnecessary re-renders of a component

B Memoizing a function inside a component

C Managing side effects

D Updating state

React.memo helps avoid re-rendering a component when props are unchanged.

Which of these is NOT a benefit of using useMemo?

A Preventing component re-renders

B Improving render performance

C Memoizing computed values

D Avoiding expensive recalculations

useMemo memoizes values but does not prevent component re-renders.

Describe how React.memo helps improve performance in React Native apps.

Think about when a component re-renders and how React.memo can avoid it.

Explain a scenario where you would use useMemo inside a React Native component.

Consider filtering or sorting large data sets.