패스트캠퍼스 챌린지 38일차 - 한 번에 끝내는 React의 모든 것 초격차 패키지 Online

수강 인증샷

---

패스트캠퍼스 챌린지란?

 패스트캠퍼스에서 진행하는 '50일 공부 루틴 챌린지' 행사로 50일 동안 매일 수강 인증샷과 함께 학습 기록을 게시글로 남기는 행사다.

---

38일차

 38일차에는 Part 1. React 기초 Ch 03. React 공식 문서로 디테일잡기(고급) 챕터에서 09. Memoization 2 강의 내용에 대해 기록하려 한다.

 Part 1. React 기초 Ch 03. React 공식 문서로 디테일잡기(고급) 챕터 09. Memoization 2 강의에서는 Memoization이라는 개념에 대해 계속 공부하면서 Profiler, useCallback과 useMemo라는 개념에 대해 공부한다.

 먼저, Profiler는 React 애플리케이션이 렌더링하는 빈도와 렌더링 비용을 측정한다. Profiler의 목적은 Memoization을 사용할 때 성능 최적화 방법을 활용할 수 있는 애플리케이션의 느린 부분들을 식별해내는 것이다. Profiler는 React 트리 내에 어디에나 추가될 수 있으며 트리 특정 부분의 렌더링 비용을 계산해준다. Profiler는 onRender 함수를 prop으로 요구하는데 React는 프로파일 트리 내의 컴포넌트에 커밋될 때마다 이 함수를 호출한다.

 useCallback은 메모이제이션된 콜백을 반환한다. useCallback은 콜백의 메모이제이션된 버전을 반환하고 그 메모이제이션된 버전은 콜백의 의존성이 변경되었을 때만 변경되고 불필요한 렌더링을 방지하기 위해 참조의 동일성에 의존적인 최적화된 자식 컴포넌트에 콜백을 전달할 때 유용하다.

 useMemo는 메모이제이션된 값을 반환한다. useMemo는 의존성이 변경되었을 때에만 메모이제이션된 값을 다시 계산하고 이 최적화는 모든 렌더링 시의 고비용 계산을 방지하게 해 준다.

---

본 게시글은 이벤트 참여를 위해 작성된 게시글입니다.

 

---

패스트캠퍼스 공식 홈페이지 : https://bit.ly/37BpXiC