버츄얼 돔과 리얼 돔의 차이

버츄얼 돔과 리얼 돔의 차이를 설명해주세요.

리얼 돔은 실제 페이지를 이루는 컴포넌트인 엘리먼트를 tree 형태로 표현한 것이며
버츄얼 돔은 그런 리얼 돔의 복사본이다.

리얼 돔은 동적인 변경이 있을 경우 전체 페이지를 검색해(DOM Tree를 검색해서)
해당 부분을 교체 한 후 전체 페이지에 대해 재 렌더링을 해준다.
그래서 크든 작든 변화 하나하나 마다 전체 페이지를 계속 갱신하는 상황에 이른다.

버츄얼 돔은 전체 DOM을 컴포넌트 단위로 쪼개어 HTML 컴포넌트 조립품 처럼 다루는 개념으로
이 조립품들이 버츄얼 돔이라 할 수 있다.
버츄얼 돔이 버퍼 역할을 해줌으로써 어떤 부분이 바뀔 지 미리 계산하고 수정한 후에
해당 수정된 부분만 업데이트 해주기 위한 기술이다.

또한 문법적인 차이도 조금 있다.
어떠한 엘리먼트를 찾을 때
리얼 돔은 HTML 문서의 querySelector등으로 메소드를 사용하며
버츄얼 돔을 사용하는 React의 경우는 ref로 엘리먼트를 찾는다.