정의

Virtual DOM은 실제 DOM을 메모리에 가볍게 복사한 가상 트리입니다.

리액트는 UI를 직접 수정하지 않고 Virtual DOM에서 먼저 변경 사항을 계산한 뒤, 필요한 부분만 실제 DOM에 반영합니다.

왜 사용할까?

1. 빠른 성능
   • 실제 DOM을 직접 조작하면 느림 → Virtual DOM으로 미리 계산 후 필요한 부분만 반영.
2. 효율적인 렌더링
   • 이전 Virtual DOM과 새로운 Virtual DOM을 **비교(diffing)**해서 바뀐 부분만 업데이트.
3. 개발 편의성
   • 상태(state)만 바꾸면 리액트가 알아서 화면을 최신 상태로 유지.
4. 예측 가능한 UI
   • 상태 기반으로 렌더링되어 코드가 간결하고 버그가 줄어듦.

핵심 포인트

• "가볍고 빠른 가상 화면 설계도"
• 변경된 부분만 실제 DOM에 반영 → 성능 최적화
• 상태 기반 렌더링으로 개발 효율 상승

모범 답안

리액트에서 Virtual DOM이 무엇인지, 이를 사용하는 이유