렌더 메소드의 아웃풋으로 리액트 엘리먼트가 나오는데
이 엘리먼트는 DOM이 아니고 DOM 엘리먼트를 가리키는 자바스크립트 객체다.
DOM보다 가벼워 새로 만들더라도 리소스를 덜 잡아 먹는다.
이를 버추얼 DOM이라고 부른다.
컴포넌트의 state가 바뀌었을 때 새로운 리액트 엘리먼트를 얻게 되고
이전의 엘리먼트와 비교한다.
바뀐 부분이 있다면 DOM의 해당 부분을 업데이트해서 버추얼 DOM과 맞춘다.
단순히 컴포넌트의 state를 바꾸면
리액트는 자동적으로 이에 맞게 변화시켜 주는 원리다.
그래서 이 라이브러리의 이름이 react이기도 하다.
'React > 일반' 카테고리의 다른 글
리액트에서 돔 엘리먼트를 변수로 참조하는 방법 (0) | 2020.06.20 |
---|---|
리액트 컴포넌트에 default props 설정 방법 (0) | 2020.06.18 |
리액트를 위한 비쥬얼 스튜디오 익스텐션 - Simple React Snippets (0) | 2020.04.23 |
리액트 라우터를 이용한 리액트 프로젝트 기본 설정 방법 (0) | 2020.04.21 |
리액트 라이프 사이클 (0) | 2020.04.18 |