DOM과 Virtual DOM

DOM이란

Document Object Model의 약자로

넓은 의미로 웹 브라우저가 HTML 페이지를 인식하는 방식을 의미한다.

좁은 의미로 본다면 document 객체와 관련된 객체의 집합을 의미할 수도 있다.

HTML, XML 문서의 프로그래밍 interface(연결장치)이다.

DOM은 문서의 구조화된 표현을 제공하며 프로그래밍 언어가 DOM 구조에 접근할 수 있는 방법을 제공하여

그들이 문서 구조, 스타일, 내용 등을 변경할 수 있게 돕는다.

DOM 은 구조화된 nodes와 property 와 method 를 갖고 있는 objects로 문서를 표현한다.

이들은 웹 페이지를 스크립트 또는 프로그래밍 언어들에서 사용될 수 있게 연결시켜주는 역할을 담당한다.

 

VirtualDOM이란

브라우저에 실제로 보여지는 DOM이 아닌,
메모리에 가상으로 존재하는 DOM으로서,
JavaScript 객체이기 때문에 작동 성능이 실제로 브라우저에서 DOM 을 보여주는 것 보다 속도가 빠르다.
대표적으로 리액트가 이 Virtual dom을 사용하는데,
변경사항이 생기면, Virtual DOM 을 통해 기존DOM과 비교하여
변경이 필요한 부분만 찾아 한번에 렌더링 하기 때문에

직접 DOM을 조작하는 것 보다 빠르다.