Page 24 -

이전 절에 있던 그림을 다시 복습해 볼까요? 여기서 오른쪽의 ‘새로운 DOM 트리’가 바로 Virtual 1

DOM입니다.

그림 1-9 두 DOM 비교 리액트 시작
이전 DOM 트리 새로운 DOM 트리

비교

업데이트될 DOM 노드

오해
Virtual DOM을 사용한다고 해서 사용하지 않을 때와 비교하여 무조건 빠른 것은 아닙니다. 리액
트 매뉴얼에는 다음 문장이 있습니다.

우리는 다음 문제를 해결하려고 리액트를 만들었습니다.
지속적으로 데이터가 변화하는 대규모 애플리케이션 구축하기

예, 그렇습니다. 결국에는 적절한 곳에 사용해야 리액트가 지닌 진가를 비로소 발휘할 수 있습니
다. 리액트를 사용하지 않아도 코드 최적화를 열심히 하면 DOM 작업이 느려지는 문제를 개선할

수 있고, 또 작업이 매우 간단할 때는(예: 단순 라우팅 정도만 있는 정적인 페이지) 오히려 리액트
를 사용하지 않는 편이 더 나은 성능을 보이기도 합니다.

리액트와 Virtual DOM이 언제나 제공할 수 있는 것은 바로 업데이트 처리 간결성입니다. UI를
업데이트하는 과정에서 생기는 복잡함을 모두 해소하고, 더욱 쉽게 업데이트에 접근할 수 있습
니다.

033

리액트를 다루는 기술(본문출력용)0720.indb 33 2018-07-20 오전 11:25:19