동일한 계산을 반복해야 할 때, 이전에 계산한 값을 메모리에 저장함으로써 동일한 계산의 반복 수행을 제거하여 프로그램 실행 속도를 빠르게 하는 기술

  1. 재사용함으로써 중복 계산 피할 수 있고 실행 시간을 줄이는 데 도움이 된다.
  2. 보통 재귀 함수에서 많이 활용한다.
  3. 함수 호출하면서 중간 결과 저장 → 같은 입력에 대해서 결과를 재사용
  4. 보조 메모리를 사용하여 이전 계산 결과를 저장한다.
  5. 입력 값들을 해시 키로 사용하여 결과를 저장하고 검색함.

동일한 입력에 대한 결과를 캐시로 저장한다.

function factorial(n) { 
  if (Number.isInteger(n) && n > 0) { 
    if (!(n in factorial)) { // factorial 안에 n이 없으면(캐시로 저장되어 있지 않다면)
      factorial[n] = n * factorial(n - 1); // 재귀 호출하여 팩토리얼 값 계산, 그리고 저장
    }
    return factorial[n]; // 저장한 값 리턴
  } else {
    return '잘못된 숫자가 입력되었습니다.';
  }
}

factorial[1] = 1; // 캐시를 초기화합니다.
factorial(6); // => 720
factorial[5]; // => 120 / 이 값은 이미 캐시에 존재합니다.

factorial은 객체이고, 그 안에 키와 값의 형태로 캐시가 저장된다.

키는 n이고, 값을 저장된 캐시라고 볼 수 있는 것

[Function: factorial] {
  '1': 1,
  '2': 2,
  '3': 6,
  '4': 24,
  '5': 120,
  '6': 720,
}

메모이제이션 관련 react hook

useMemo

계산 비용이 큰 함수의 결과 값을 메모이제이션하여 재사용하는데 사용.

이전에 계산된 값을 기억하고, 동일한 입력에 대해서는 이전 결과를 반환하여 중복 계산 제거