리액트에서 배열을 렌더링할 때 key를 써야 하는 이유에 대해 설명해 주세요.1. Key리액트 컴포넌트에 고유성을 부여하는 컴포넌트 속성2. Key 규칙key값은 조건부 렌더링 or 배열 렌더링처럼 함께 고려되는 형제 컴포넌트 간에 고유해야 함key값은 변경되지 않아야 함3. 배열 렌더링리액트 렌더링 참고배열 리터럴이나 map() 메소드로 복수의 컴포넌트를 반환할 경우, 배열 렌더링 과정을 거침배열 렌더링 중 비교 알고리즘을 적용할 때, 리액트는 기본적으로 나열 순서(인덱스)를 기준으로 전후 컴포넌트를 비교함배열 내에서 순서가 바뀔 경우, 인덱스를 기준으로 비교하므로 순서 변경을 고려치 못해 비효율적인 렌더링이 이뤄짐4. 배열 렌더링과 Key배열 내 각 컴포넌트에 고유한 key가 할당될 경우, 배열 렌더..

리액트에서 Virtual DOM이 무엇인지, 이를 사용하는 이유는 무엇인지 설명해 주세요.1. DOMDocument Object ModelHTML 문서를 계층 구조의 객체로 표현한 것각 객체를 노드로 여기고, 요소/텍스트/주석 노드로 구분2. 브라우저 렌더링DOM/CSSOMHTML/CSS를 분석하여 DOM/CSSOM 생성렌더 트리DOM에 CSSOM을 부착하여 렌더 트리 구성레이아웃렌더 트리 내 노드의 구조 및 위치 결정리렌더링 시 리플로우라고 표현페인팅렌더 트리 노드에 색칠리렌더링 시 리페인팅이라고 표현위와 같은 렌더링 과정을 CRP(Critical Rendering Path)라고 표현함3. Virtual DOMReact에서 사용하는 가상의 DOM 추상화실제 DOM에서 이뤄져야 할 변경 사항들을 가상 D..