Top Three React Interview Questions On Memoization

React Advance Concepts Part 3: useMemo vs. useCallback

Ashutosh Kumar
JavaScript in Plain English

--

Photo by JESHOOTS.COM on Unsplash

In this article, we continue our React Advance series Part 3, In the previous two articles we covered Memoization techniques in React: React.Memo, useCallback and useMemo.

In this article, we will cover the three most asked Interview Questions related to memoization in React

Q1: Which memoization technique to use in different scenarios?

React.Memo

const SampleComponent = (props){
return (
<div>...</div>
)
}

export default React.memo(SampleComponent)

React.Memo is a Higher Order Component in React which gives a memoized version of the Component. React will then not re-render the memoized component unless its props have changed, even if its parent is being re-rendered.

useCallback

import { useCallback } from "react"

const memoizedFn = useCallback(() => {
// Function…

--

--

Responses (2)

What are your thoughts?