가상 DOM이란?

가상 DOM(Virtual DOM)은 React에서 사용하는 개념으로, UI의 표현을 메모리에 유지하고 이를 변경하고, 실제 DOM과 동기화하는 기술입니다.

즉, 가상 DOM(VDOM)은 실제 DOM의 인메모리 표현입니다.

React 컴포넌트들의 상태(State)가 변할 때마다, 새로운 UI를 만들어 냅니다. 이 새로운 UI를 기존 UI와 비교해서 변경된 부분을 찾아내고, 그 부분만 실제 DOM에 반영하여 화면을 업데이트 합니다.

이 과정에서 가상 DOM은 메모리 상에서만 존재하며, 변경된 부분을 찾아내기 위한 비교 연산이 실제 DOM에 비해 효율적으로 처리됩니다. 이를 통해 React는 화면을 효율적으로 업데이트하면서도, 복잡한 UI 상태 관리를 단순화할 수 있는 장점을 가지고 있습니다.

이 모든 과정을 재조정(reconciliation)이라고 합니다.