Virtual Dom(가상 돔)이란?

🎀 Virtual Dom

실제 DOM과 같은 내용을 담고있는 복사본을 뜻한다. 이 복사본은 자바스크립트 객체 형태로 메모리에 저장되어 진다.

🎀 왜 생겨났을까

가상 돔이 없을때에는 DOM을 직접 조작했었다. 그러나 매번 실제 돔을 직접 조작하는 것은 비효율적이다. 가상 돔은 메모리 상에서 작업을 수행하므로 더 빠르게 업데이트를 수행할 수 있다.

• 리액트는 항상 두개의 가상 돔을 가지고 있다.
  첫번째 가상 돔 : 변경 이전의 내용을 담고있음
  두번째 가상 돔 : 변경 이후 보여질 내용을 담고있음

• 실제 변경 내용이 DOM에 적용되기 전,
  리액트는 두 개의 가상 돔을 비교하여 정확히 어떤 부분의 변경 필요한지 파악한다.
  이 과정을 Diffing라고 부른다.

• Diffing을 통해 변경 필요한 부분들을 파악하고, 그것들을 하나하나 차례로 적용시키는 것이 아니라 Batch Update 즉, 모든 변경 사항을 취합하여 DOM에 한번에 반영 시킨다. 이를 Reconciliation(재조정)이라고 부른다.
  
  
  
  

👉🏻 참고 영상