useMemo()를 사용하십시오.

useMemo()는 React 훅과 2개의 인수-함수와 종속성을 빌드합니다.const memoizedResult = useMemo(compute, dependencies);Trong quá trình render lần đầu, useMemo(compute,dependencies) ngay lập tức gọi compute , ghi nhớ value đã return cho vào memorizes, và trả về component.
Nếu trong suốt quá trình renderings, các dependencies không thay đổi, useMemo() không gọi compute mà return memorized value.
Nhưng nếu các 종속성 thay đổi trong quá trình re-rendering, useMemo() sẽ gọi compute , no sẽ 업데이트 một value mới vào memorizes, và trả về value đó.
useMemo() 보기
Một component nhằm tính giai thừa của một số.

import { useState } from 'react';
export function CalculateFactorial() {
  const [number, setNumber] = useState(1);
  const [inc, setInc] = useState(0);
  const factorial = factorialOf(number);
  const onChange = event => {
    setNumber(Number(event.target.value));
  };
  const onClick = () => setInc(i => i + 1);

  return (
    <div>
      Factorial of 
      <input type="number" value={number} onChange={onChange} />
      is {factorial}
      <button onClick={onClick}>Re-render</button>
    </div>
  );
}
function factorialOf(n) {
  console.log('factorialOf(n) called!');
  return n <= 0 ? 1 : n * factorialOf(n - 1);
}

Mỗi khi bạn thay đổi giá trị 입력, factorialOf(n) 및 factorialOf(n) được gọi.
Ben cạnh đó, mỗi lần bạn nhấn re-render, set state inc sẽ được update và component <CalculateFactorial/> sẽ được re-rendering. Nhưng, trong lần render thứ 2, factorialOf(n) được gọi lại lần nữa.factorial khi 구성 요소가 다시 렌더링됩니까?
Bằng cách sử dụng useMemo(()=>factorialOf(number),[number]) thay vì đơn giản factorialOf(number) , React sẽ ghi nhớ factorialVí dụ

import { useState, useMemo } from 'react';
export function CalculateFactorial() {
  const [number, setNumber] = useState(1);
  const [inc, setInc] = useState(0);
  const factorial = useMemo(() => factorialOf(number), [number]);
  const onChange = event => {
    setNumber(Number(event.target.value));
  };
  const onClick = () => setInc(i => i + 1);

  return (
    <div>
      Factorial of 
      <input type="number" value={number} onChange={onChange} />
      is {factorial}
      <button onClick={onClick}>Re-render</button>
    </div>
  );
}
function factorialOf(n) {
  console.log('factorialOf(n) called!');
  return n <= 0 ? 1 : n * factorialOf(n - 1);
}

Mỗi lần ấn 버튼 Re-render , factorial(n) không được in ra màn hình console bởi vì useMemo 반환 기억된 của factorial케트루언useMemo(()=>computation(a,b),[a,b]) cho phép bạn ghi nhớ các phép tính lưu vào vung nhớ 암기. Với các 종속성 [a,b] giống nhau, hook sẽ trả về 기억된 값 mà không cần gọi 계산(a,b)