[react] 언제 memoization을 해야 할까?

메모이제이션 개념만 보았을 때는 굉장히 효율적이고 최적화가 이루어질 것 같지만, 

명확한 목적없이 사용하는 것은 오히려 비효율적이다. 

 

그러므로, memoization 하기 전에 

1. 새로운 값을 만드는 것이 비용이 적게 들지

2. 이전의 값을 저장해두고, 메모이제이션 함수를 호출하고, 의존성을 비교해서 가져오는 것이 비용지 적게 들지

판단하는 과정이 필요하다.

 

판단의 대한 답은 상황에 따라 다르다. 

리엑트에서 메모이제이션이 필요하다고 판단할 수 있는 요인은 2가지가 있다.

1. 새로운 값을 만드는 연산이 복잡한 경우

2. 함수 컴포넌트의 이전 호출과 다음 호출 간 사용하는 값의 동일성을 보장하고 싶은 경우

 

1번의 경우, 만약 100000개의 요소를 가진 배열이 있다고 생각하면 이 배열을 매번 생성하는 것보다 메모해서 사용하는 것이 보다 효율적이다.

2번의 경우 React.memo와 연동해서 사용하기 위해서이다. props로 전달되는 객체의 동일성이 보장되지 않는다면 실제 객체의 내용은 같을 지라도 shallow compare를 통해 다른 객체라고 판단되어 매번 리렌더링이 실행될 수 있다. 이러한 상황에서는 전달되는 객체의 동일성을 보장하기 위해 메모이제이션을 사용하는 것이 보다 효율적일 수 있다. 

 

 

---

질문이나 잘못된 점은 댓글로 남겨주세요 :)💖