분류 전체보기22 [React] React.memo 사용법 메모이제이션(Memoization)이란? JS 메모이제이션에서도 공부했지만 리마인드 차원에서 다시 살펴 보자면, 프로그래밍에서 반복되는 결과를 메모리에 저장 해놓고 다음에 같은 결과가 나올 때 다시 계산할 필요없이 빨리 실행 하는 코딩 기법을 말하는 것이다. 1. React에서 Memoization 먼저 React에서 컴포넌트가 렌더링하는 규칙에는 대표적으로 크게 3가지가 존재한다. State가 업데이트된 컴포넌트 Props가 변경된 컴포넌트 Re-Rendering 된 부모컴포넌트의 모든 자식컴포넌트 이 중 세번째 Re-Rendering 된 부모컴포넌트의 모든 자식컴포넌트들은 불필요한 렌더링이 일어난다. 이러한 불필요한 렌더링은 애플리케이션의 규모가 커질수록 더욱 성능저하가 올 수 있다. 따라서 성능최적.. 2024. 1. 1. [JavaScript] 메모이제이션 (Memoization) 메모이제이션(Memoization)이란? "메모이제이션이란 프로그래밍을 할 때 반복되는 결과(복잡한 연산의 함수)를 메모리에 저장해서 다음 호출에도 같은 결과가 나올 때 캐시된 값을 가져오는 코딩 기법을 말합니다." 아래 내용에서는 전역변수와 클로저 그리고 재귀함수를 통하여 메모이제이션이 JavaScript에서 어떻게 활용되는지 알아보자. 재귀함수란? 함수 안에 자신의 함수를 다시 호출하는 함수를 의미한다. 이러한 재귀함수는 자신의 로직을 내부적으로 반복하다가, 일정한 조건이 만족되면 함수를 이탈하여 결과를 도출한다. 클로저란? 클로저는 반환된 내부함수가 자신이 선언됐을 때의 환경(Lexical environment)인 스코프를 기억하여 자신이 선언됐을 때의 환경(스코프) 밖에서 호출되어도 그 환경(스코.. 2024. 1. 1. 이전 1 ··· 3 4 5 6 다음