[REACT] useMemo와 React.memo의 차이점

리액트 훅을 배우다보면 자연스럽게 알게되는 useMemo와 React.memo는 같은 'memo'라는 단어를 사용하는데다 최적화를 위해 사용하는 것이라, 괜히 헷갈렸던 차에 스스로 정리차 올려보는 글.useMemo와 React.memo는 둘 다 불필요한 연산과 리렌더링을 방지하는 최적화 기법이지만, 적용 대상과 방식이 다르다! 오늘은 두 개를 구분하여 적고 설명해보고자 한다.1. useMemo → 값 (연산 결과)를 캐싱" 이 연산, 다시 계산할 필요 있어? "특정 연산(예: 배열 필터링, 정렬, 무거운 계산)의 결과값을 메모이제이션해서, 불필요한 연산을 방지하는 역할.의존성 배열의 값이 바뀌지 않으면 이전 값을 재사용.useMemo의 종류는 'hook'사용 예시 import { useState, use..

• format_list_bulleted REACT
• · 2025. 3. 25.

[REACT] React Hooks 정리 및 사용법

리액트를 하다보면 리액트 훅은 무조건 알아야 할 필수적인 요건! 가장 기본적이고 기초적인 만큼 여기다가 정리해서 적어보고자 한다. 정리하면서 다시 한 번 복습하기는 덤 ✌👀 React Hook란?React Hook은 함수형 컴포넌트에서 상태와 생명주기 기능을 사용할 수 있도록 도와주는 기능! 기존에는 클래스형 컴포넌트에서만 상태(state)와 생명주기 메서드(componentDidMount, componentDidUpdate 등)를 사용할 수 있었지만, Hook을 활용하면 함수형 컴포넌트에서도 이를 쉽게 구현할 수 있습니다. (리액트 v16.8부터 새로 도입되었다고 해요)생명주기란?React에서 생명주기란 컴포넌트가 화면에 나타나고, 업데이트되고, 사라지는 과정을 의미합니다.컴포넌트가 처음 나타날 때 ..

• format_list_bulleted REACT
• · 2025. 3. 15.