Momoization Concept
useMemo
react.memo
Live Demo
useMemo vs useCallback
What problem solve in useMemo ?
Why need useMemo?
Does useMemo has any disadvantage?
Background
The term “Memoization” comes from the Latin word “memorandum” (to remember), which is commonly shortened to “memo” in American English, and which means “to transform the results of a function into something to remember.”.
Memoization
In computing, memoization is used to speed up computer programs by eliminating the repetitive computation of results, and by avoiding repeated calls to functions that process the same input.
useMemo
The useMemo is a hook used in the functional component of react that returns a memoized value.
Syntex
useMemo() is a built-in React hook that accepts 2 arguments — a function compute that computes a result, and the depedencies array:
react.memo
Memo is a higher-order component that is used to memoize a component, which means it caches the output of the component and only re-renders it if its props have changed. This can be useful when a component’s rendering is expensive, and you want to avoid unnecessary re-renders. Memo can be imported from ‘react’ and wrapped around a functional component.
useMemo vs useCallback
The useMemo and useCallback Hooks are similar. The main difference is that useMemo returns a memoized value and useCallback returns a memoized function
What problem solved in useMemo ?
Improve Application Performance
How to implement Memoization concept in class component ?
Using PureComponent
Does useMemo have any disadvantage?
Yes we can’t call useMemo in loop like
Resolution