AI 요약관련 정보

• useMemo는 React 함수 컴포넌트 내에서 발생하는 불필요한 연산을 최적화하여 성능을 향상시키는 훅입니다. 🚀
• Vue.js의 computed 속성과 유사하게, 특정 데이터의 변화에만 반응하여 연산을 수행하도록 설계되었습니다. 💡
• useMemo를 사용하지 않으면, 컴포넌트 내 어떤 상태라도 변경될 때마다 모든 연산 함수가 재실행되어 불필요한 리소스 낭비가 발생할 수 있습니다. 📉
• 예시에서는 입력 필드(number 상태)의 한 글자 변화에도 평균 계산 함수(getAverage)가 반복적으로 호출되어 비효율적임을 보여주었습니다. ⌨️
• useMemo는 콜백 함수와 의존성 배열을 인자로 받아, 의존성 배열의 값이 변경될 때만 콜백 함수를 재실행하도록 합니다. 🔄
• 이를 통해 list 배열이 실제로 변경될 때만 평균을 다시 계산하도록 하여, 입력값 변경 시의 불필요한 연산을 효과적으로 방지했습니다. ✅
• 결과적으로 useMemo는 불필요한 렌더링과 연산을 줄여 애플리케이션의 전반적인 성능과 효율성을 크게 향상시킵니다. ⚡
• 반복적으로 사용되는 계산된 데이터 형태의 로직이 있을 때 useMemo를 활용하면 더욱 효율적이고 최적화된 코드 작성이 가능합니다. 🧠