JavaScript에서 메모이제이션을 사용하는 방법

메모이제이션은 처리 결과를 메모리에 저장하여 나중에 동일한 입력이 주어지면 계산을 건너뛰고 동일한 결과를 반환하는 코드 최적화 기술입니다.

이를 설명하기 위해 render 라는 값비싼 함수가 있다고 가정해 보겠습니다. render 함수는 일부 속성을 인수로 사용하고 전달한 속성을 기반으로 2D 모델을 렌더링합니다.


render 함수의 비용이 많이 드는 특성으로 인해 동일한 입력으로 동일한 계산을 다시 수행하고 싶지 않습니다. 따라서 각 렌더링에서 입력과 출력을 키-값 쌍으로 메모리에 저장합니다.



다음에 동일한 입력을 발견할 때 빠르게 조회할 수 있어 컴퓨팅 시간을 절약할 수 있습니다.

자바스크립트 메모이제이션

이제 javaScript에서 메모이제이션을 구현하는 방법을 살펴보겠습니다. 여기에 전달한 숫자에 2를 더하고 결과를 반환하는 간단한 함수가 있습니다.

function addTwo(num) {
  return num + 2;
}

우리가 하고 싶은 것은 그 함수의 메모화된 버전을 만드는 것입니다. 이를 달성하기 위해 메모화하려는 함수를 매개 변수로 사용하고 새 함수를 반환하는 memoize 함수를 정의해 보겠습니다.

function memoize(fn) {
  const memo = {};
  return (...args) => {
    const argsStr = JSON.stringify(args);

    if (memo[argsStr]) {
      const result = memo[argsStr];
      return result;
    }

    const result = fn(...args);
    memo[argsStr] = result;
    return result;
  };
}

입력을 각각의 출력에 매핑하기 위해 memo 변수를 a closure으로 정의했습니다. 다음에 반환하는 새 함수에는 모든 메모이제이션 논리가 포함되어 있습니다. 주어진 인수를 이미 발견한 경우 memo에서 해당 결과를 반환합니다.

function memoize(fn) {
  //...
  return (...args) => {
    if (memo[argsStr]) {
      return memo[argsStr];
    }
    //...
  };
}

그렇지 않으면 계산을 진행하고 결과를 memo에 저장합니다.

function memoize(fn) {
  //...
  return (...args) => {
    //...
    const result = fn(...args);
    memo[argsStr] = result;
    return result;
  };
}

이제 addTwo 함수의 메모화된 버전을 만들 준비가 모두 끝났습니다.

const memoizedAddTwo = memoize(addTwo);

console.log(memoizedAddTwo(2)); //==> 4
console.log(memoizedAddTwo(2)); //==> 4 known input. It uses memo!
console.log(memoizedAddTwo(5)); //==> 7 new value

메모이제이션을 사용하는 경우

현실 세계에서 addTwo 와 같은 함수에 메모이제이션을 사용하는 것은 지나친 일입니다. 대신 프로세스에 시간이 많이 소요될 때 사용합니다.

메모이제이션의 문제

메모이제이션은 메모리 공간 비용으로 시간을 절약해 줍니다. 너무 자주 사용하면 각 입력과 출력을 매핑하는 데 사용하는 메모리 공간이 비례하여 커집니다. 일부 공간을 확보하기 위해 알려진 입력에서 결과를 반환할 때마다 매핑을 삭제하여 이러한 영향을 줄일 수 있습니다.

//...
if (memo[argsStr]) {
  const result = memo[argsStr]
  delete memo[argsStr]
  return result;
}
//...

마무리

메모이제이션을 사용하면 비용이 많이 드는 함수의 다양한 결과를 추적할 수 있으므로 알려진 입력에 대해 계산을 반복할 필요가 없습니다. 그러나 이 기술은 시간과 메모리 공간을 교환하므로 신중하게 사용해야 합니다.