학습 공간 개념 · 판단 · 실험

Fanta Lab

질문 64 · 실전 면접 답변

가상 DOM은 무엇을 뜻하나요?

이렇게 답해 보세요 (핵심 답변)

가상 DOM은 실제 브라우저 DOM을 직접 수정하기 전에, 원하는 UI 구조를 메모리상의 가벼운 JavaScript 객체 트리로 표현하는 방식입니다. React 엘리먼트는 특정 시점의 화면 설명서일 뿐 실제 DOM 노드가 아니며, React는 이전 설명서와 새 설명서를 비교해 필요한 변경만 커밋 단계에서 적용합니다. 따라서 가상 DOM을 브라우저 엔진의 복제판이나 무조건적인 속도 보장 장치로 보기보다 선언적 UI를 가능하게 하는 표현 계층으로 이해해야 합니다.

함께 설명하면 좋은 이유 (꼬리질문 대비)

  1. UI 설명 객체와 실제 호스트 DOM 노드를 분리하면 상태를 기반으로 화면을 선언적으로 조합하고 테스트하기 쉬워집니다.
  2. 객체 트리를 생성하고 비교하는 작업 자체에도 비용이 들기 때문에 실제 성능은 화면 크기와 업데이트 범위에 따라 달라집니다.

면접에서 자주 하는 실수

가상 DOM이라는 개념을 React의 스케줄링과 재조정(Reconciliation) 알고리즘 전체와 완전히 같은 뜻으로 혼동하지 않아야 합니다.

원리와 예제까지 읽기

공식 참고 자료

질문 목록 출처 ↗ · 원본 64번을 바탕으로 질문과 답변을 새로 정리했습니다.

← React