[React.js] 메모리제이션을 통해 성능 최적화 하기
React에서는 성능을 최적화하기 위해 React.memo, useCallback, useMemo 라는 세가지 기능 제공합니다. 각각의 기능들은 특정 상황에서 컴포넌트 렌더링을 최적화 하는데 사용됩니다. 세 가지 기능들이 무슨 역할을 하는지와 사용법에 대해 알아보도록 하겠습니다. React.memoReact.memo는 고차컴포넌트로 함수형 컴포넌트에서 불필요한 리렌더링을 방지하는데 사용됩니다.얕은 비교를 통해 props가 변경이 될때에만 해당 컴포넌트를 리렌더링합니다. 즉, props가 변경되지 않으면 리렌더링을 하지 않습니다. 예시 코드const MyComponent = (props) => { // 컴포넌트 구현};export default React.memo(MyComponent); // React..
React.js
2024. 5. 20. 19:32
공지사항
최근에 올라온 글
최근에 달린 댓글
- Total
- Today
- Yesterday
링크
TAG
- 24431
- zustand
- NextAuth
- stompjs
- React
- revalidateTag
- 해시를 사용한 집합과 맵
- revalidatePath
- 25329
- baekjoon
- react.memo
- useCallback
- 4659
- useState
- 20551
- rc-dock
- useMemo
- 9575
- useQuery
- react-three-fiber
- React.JS
- js
- 백준
- react-query
- Next.js
- dynamic routing
- RefreshToken
- eventemitter3
- web3
- sepolia
| 일 | 월 | 화 | 수 | 목 | 금 | 토 |
|---|---|---|---|---|---|---|
| 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 |
글 보관함