원문 https://ko-react-exy5xcwjj-fbopensource.vercel.app/learn/understanding-your-ui-as-a-tree
1️⃣ 트리와 UI의 관계
트리는 요소와 UI 사이의 관계를 모델링함
UI는 트리 구조를 사용하여 표현됨
2️⃣ 트리 구조의 활용
브라우저는 HTML(DOM)과 CSS(CSSOM)을 트리 구조로 모델링
모바일 플랫폼도 뷰 계층 구조를 트리로 표현
React는 컴포넌트로부터 UI 트리를 생성합니다. 이 예에서 UI 트리는 DOM을 렌더링하는 데 사용됩니다.
React는 컴포넌트로부터 UI 트리를 생성합니다. 이 예에서 UI 트리는 DOM을 렌더링하는 데 사용됩니다.
1️⃣ React와 트리 구조
React는 컴포넌트 간의 관계를 관리하기 위해 트리 구조 활용
2️⃣ 트리 구조의 역할
데이터 흐름, 렌더링, 앱 크기 최적화 이해에 도움
1️⃣ 컴포넌트 중첩 구조
컴포넌트는 다른 컴포넌트로 구성되며 부모-자식 관계 형성
2️⃣ 렌더 트리
React는 컴포넌트 관계를 트리 구조로 모델링하여 렌더링 수행