Dom

Dom 은 Document Object Model 의 약어로, 웹 브라우저에서 이를 활용하여 객체에 Javascript, Css 를 적용한다. Dom 자체는 빠르지만, 웹 브라우저 단에서 Dom 의 변화가 일어나면 연산, 레이아웃 구성, 페이지 리페인트를 하는 과정에서 느려지게 된다.

Virtual Dom

Dom 을 최소한으로 조작하여 작업을 처리하기 위한 방법. DOM 업데이트를 추상화함으로써 DOM 의 처리 횟수를 최소화하고 효율적으로 진행. Dom 의 가벼운 사본이라고 생각하면 됨.

React 에서 웹 브라우저로 DOM 을 업데이트 하는 방법

• 데이터를 업데이트 하면 전체 UI 를 Virtual Dom 에 리랜더링.
• 전후 Virtual Dom 의 내용을 비교.
• 바뀐 부분만 실제 DOM 에 적용.

Virtual Dom 의 장점

업데이트 처리의 간결성! 업데이트 과정에서 생기는 복잡함 해소, 업데이트 접근.