원티드 프리온보딩 프론트엔드 챌린지 4월 사전과제
elsa-kim opened this issue · comments
-
React Lifecycle에 대해 간단히 설명해주세요
모든 리액트 컴포넌트에는 라이프 사이클이 존재한다. 컴포넌트 수명은 페이지에 렌더링 되기 전인 준비 과정에서 시작해 페이지에서 사라질 때 끝난다. 클래스형 컴포넌트에서만 사용 가능(함수형에서는 Hooks 기능 사용)
3가지 카테고리 마운트, 업데이트, 언마운트로 나뉜다. 9가지 메소드를 갖는다. -
React18에서 업데이트 된 기능에 대해 설명해주세요
- Automatic Batching : 상태 업데이트를 하나로 통합해 배치처리를 한 후 리렌더링 진행
- Concurrent Feature : 기존 React에서 추구하고 있는 Concurrent Mode( 동시성 )를 하나의 기능으로 지원
- createRoot : 기존의 render()와 다르게 createRoot API 활용
- startTransition : 기존 사용자 경험 개선 위해 사용했던 디바운스, 쓰로틀링, setTimeout등의 기능 지원
- Suspense와 SSR : 독립적으로 각각의 렌더링 가능한 기능 추가
- React Server Component(RSC) : node.js와 같은 Server 역할을 수행하는 Server Component 기능을 제공
- New Hooks
- useId
- useSyncExternalStore
- useDeferredValue
- useInsertionEffect
- React18에서 추가된 hook들에 대해 설명해주세요
- useId : 클라이언트와 서버간의 hydration의 불일치를 피하면서 유니크 아이디를 생성 기능을 제공
- useSyncExternalStore : 동시성 기능을 사용할 때 전역 상태 관리 라이브러리의 상태가 업데이트 되지 않을 경우 강제로 업데이트를 발생
- useDeferredValue : 트리에서 급하지 않은 부분의 재랜더링을 지연할 수 있는 기능을 지원, 디바운스와 비슷하지만 고정된 지연시간이 없고 렌더링이 반영되는 시점에 지연 렌더링을 시도
- useInsertionEffect : Css-in-JS 라이브러리를 활용할 때 스타일 삽입 성능 문제를 해결, Dom이 한번 mutate된 이후 실행되지만 layout effect가 발생하기 전 새 레이아웃을 한번 읽을 수 있기 때문에 사전에 계산할 수 있는 기회가 주어짐, 기존 useLayoutEffect와 비슷하지만 다른점은 DOM 노드에 대한 참조에 접근할 수 있게 됨
- 요즘 관심있는 주제가 있다면 알려주세요
알고리즘에 대해 관심이 있습니다