Virtual DOM(Document Object Model) VS Real DOM

Virtual DOM
- 실제 DOM의 가상 복제본으로 jS 객체로 이루어진 가상트리. 실제 DOM의 계층 구조와 유사하게 구성되어 있으며, UI 상태를 반영
- 업데이트 최적화: 가상 DOM은 UI 변경 사항을 추적하고, 변경된 부분만 실제 DOM에 저굥하는데 사용됨. DOM 조작 횟수 최소화하고,
```
         업데이트 프로세스를 최적화 할 수 있음.
```
- 라이브러리 및 프레임워크활용: React 등의 라이브러리 및 프레임워크는 Virtual DOM을 활용하여 UI 업데이트를 효율적으로 처리함.
Real DOM
- 웹 브라우저에서 직접 조작하는 실제 DOM. HTML 요소, 속성, 스타일, 이벤트 등의 모든 것을 나타냄.
- 업데이트 오버헤드: UI 업데이트 시 새로운 DOM 요소를 생성하고 기존 요소와 비교하여 변경된 부분을 변경. 오보헤드가 크고 성능저하로 이어짐.

Reference
chat-gpt

terryEHLee