-
Book Overview & Buying
-
Table Of Contents
-
Feedback & Rating
Learn React with TypeScript - Third Edition
By :
In this section, we will learn about the memo Hook and where it is useful. We will then walk through an example in the PersonScore component we have been working on.
The memo Hook creates a memoized value and is beneficial for values that have computationally expensive calculations. The Hook is called useMemo and the syntax is as follows:
const memoizedValue = useMemo( () => expensiveCalculation(), [] );
A function that returns the value to memoize is passed into useMemo as the first argument. The function in this first argument should perform the expensive calculation.
The second argument passed to useMemo is an array of dependencies. So, if the expensiveCalculation function has dependencies a and b, the call will be as follows:
const memoizedValue = useMemo( () => expensiveCalculation(a, b), [a, b] );
When any dependencies...