Notice
Recent Posts
Recent Comments
Link
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | 6 | |
7 | 8 | 9 | 10 | 11 | 12 | 13 |
14 | 15 | 16 | 17 | 18 | 19 | 20 |
21 | 22 | 23 | 24 | 25 | 26 | 27 |
28 | 29 | 30 | 31 |
Tags
- express
- SSR
- FigJam
- TypeScript
- TAILWIND
- github
- react
- docker
- FIGMA
- 자료구조
- Javascript
- Stack
- render
- Babel
- grid
- git
- Taillwind
- hook
- useCallback
- 해시
- CSS
- 피그마
- axios
- HTML
- webpack
- useMemo
- 코딩테스트
- Next.js
- 프로그래머스
- EC2
Archives
- Today
- Total
목록2024/01/06 (1)
나는 오늘도 멋있다
React.memo
React.memo란? 부모로 부터 전달받은 Props의 상태변경이 일어나지 않았을때 불필요한 렌더링을 방지하는 API 오직 Props 변화에만 의존하는 최적화 방법 React.memo 왜 사용해야할까? React의 함수형 컴포넌트에서 상태가 변했을경우 컴포넌트는 리렌더링이 발생한다. 문제는 자식의 상태는 변경되는것이 없는 상황에서 부모컴포넌트의 상태가 변경됨으로써 자식은 불필요한 렌더링이 발생한다. 그렇기에 해당 자식이 부모에게 받는 props의 상태가 동일하다면 자식을 렌더링 하지 않도록 할수 있다. React.memo 구문 const ComponentName = memo(Component) Component: 부모에게 Props를 받는 컴포넌트 React.memo 동작방식 부모에게 받는 Props가..
Web/ReactJS
2024. 1. 6. 13:14