💻 Dev

🛠️ 처음부터 만드는 Memoize — 함수 결과를 캐싱해서 성능 높이기

반복 계산되는 함수 결과를 메모리에 저장해두고 재사용하는 패턴입니다.

기본 구현


```javascript
const memoize = (fn) => {
const cache = new Map();

return function(...args) {
const key = JSON.stringify(args);

if (cache.has(key)) {
return cache.get(key);
}

const result = fn.apply(this, args);
cache.set(key, result);
return result;
};
};
```

실전 예제


```javascript
// 느린 피보나치 (메모이제이션 전)
const fib = (n) => {
if (n <= 1) return n;
return fib(n - 1) + fib(n - 2);
};
// 메모이제이션 적용
const memoFib = memoize(fib);
console.time('memoized');
console.log(memoFib(40)); // ~1ms
console.timeEnd('memoized');
```

주의사항


1. Pure Function만 사용: 같은 인자로 항상 같은 결과를 반환해야 합니다
2. 메모리 관리: 캐시가 계속 증가하므로 필요시 LRU 캐시 구현
3. 복잡한 인자: `JSON.stringify`가 느릴 수 있으니 WeakMap 사용 고려

TypeScript 버전


```typescript
function memoize any>(fn: T): T {
const cache = new Map();

return ((...args: any[]) => {
const key = JSON.stringify(args);
if (cache.has(key)) return cache.get(key);

const result = fn(...args);
cache.set(key, result);
return result;
}) as T;
}
```
API 응답 캐싱, 복잡한 계산, 렌더링 성능 최적화에 유용합니다. [MDN - Memoization](https://developer.mozilla.org/en-US/docs/Glossary/Memoization)
💬 0
👁 0 views

Comments (0)

💬

No comments yet.

Be the first to comment!