Context
https://ko.reactjs.org/docs/context.html
컴포넌트 트리제약 -> Props drilling의 한계 해소
재사용성 -> Context를 사용하면 재사용하기 어려움
API -> createContext/ Provider / Consumer
useContext -> Consumer 대체
Portal
https://ko.reactjs.org/docs/portals.html
DOM 계층 구조 바깥에 있는 DOM 노드로 자식을 렌더링하는 최고의 방법
createPortal -> 부모 컴포넌트 DOM 트리로부터 벗어나기
이벤트 -> Portal에 있더라도 Event는 트리로 전파
Render Props
https://ko.reactjs.org/docs/render-props.html
재사용의 한 방법 (Composition / HOC / render props...)
render props -> 무엇을 렌더링할 지 알려주는 함수
render일 필요 -> 없음, children도 되고 뭐든 됨
PureComponent -> props, state 비교하여 성능 최적화
PropTypes
https://ko.reactjs.org/docs/typechecking-with-proptypes.html
Props의 타입을 확인하기 위한 도구(like. Flow, TypeScript같은 정적 타이핑 도구)
개발 모드에서만 동작 -> 유효하지 않은 prop에 대한 경고
custom -> RegExp 등으로 사용자 정의 가능
children 제한 -> 원래 제약없던 갯수 제약 가능
Reconciliation
https://ko.reactjs.org/docs/reconciliation.html
UI 갱신에 대한 React의 접근법
루트부터 비교 -> 무엇을 렌더링할 지 알려주는 함수
트리를 파괴 -> 부모가 바뀌었다면 트리를 버린다
Keys -> 자식 재귀 처리 시 효율성 확보
Reconciliation 2
Virtual DOM
https://ko.reactjs.org/docs/faq-internals.html
가상의 표현을 메모리에 저장하고 실제 DOM과 동기화하는 과정 === 재조정
Design Priciples
https://ko.reactjs.org/docs/design-principles.html
리액트가 무엇을 하고 무엇을 하지 않는지에 대한 개발 철학
리액트의 스케쥴링 업데이트(setState가 비동기적인 이유)
Virtual DOM -> 실제 DOM과 동기화 할 가상 표현
재조정 -> 실제 DOM과 Virtual DOM의 동기화
React Fiber -> 스택 reconciler 대체한 재조정 엔진
