가상 돔(Virtual DOM) 이란?

하율찬·2022년 7월 25일
0

기술면접스터디

목록 보기
6/10

정리
가상 돔(Virtual DOM) 이란?
실제 돔에 가벼운 사본입니다.
Virtual DOM을 사용하면 실제 DOM에 접근하여 조작하는 대신,
이를 추상화한 자바스크립트 객체를 구성하여 사용합니다.
DOM의 상태를 메모리에 저장하고, 변경 전과 변경 후의 상태를 비교한 뒤
최소한의 내용만 반영하여 성능 향상에 기여합니다.

  • 리액트를 이용해 돔을 업데이트 시키는 절차
  1. 데이터가 업데이트 되면, 전체 UI를 Virtual DOM에 리렌더링함
  2. 이전 Virtual DOM에 있던 내용과 현재의 내용을 비교함 (가상 돔 끼리 비교)
  3. 바뀐 부분만 실제 DOM에 적용이 됨
    (컴포넌트가 업데이트 될때 , 레이아웃 계산이 한번만 이뤄짐)
profile
함께 일하고 싶어지는 동료가 되기를 원하는 프론트엔드 개발자입니다.

0개의 댓글