0608 특강(React)

리액트의 업데이트는 왜 편리한걸까?

1. 선언형 프로그래밍
2. 컴포넌트 기반의 UI 표현
3. Virtual DOM(가상 돔)

Virtual DOM

• 동시에 발생한 업데이트를 모아 Virtual DOM에 반영후 Actual DOM에 한번만 반영

Reconciliation(재조정)이란?

1. 업데이트가 한번 더 발생하면 next virtual DOM 생성후 prev virtual DOM과 비교
2. 변화된 부분만 모아 Actual DOM에 반영후 next virtual DOM을 prev vurtual DOM으로 변환
3. Actual DOM을 직접 수정하는 것보다 무조건 빠르지는 않음 하지만 대부분의 상황에 빠른 업데이트

Reconciliation(재조정) 과정은 어떻게 진행될까?

• React element : 리액트 컴포넌트가 반환하는 값으로 모여서 가상돔이 됨
• 요소에 key가 없을 때: 노드 순서대로 비교하기 때문에 버그 발생할 수 있음

리액트 사용시 유의

• key에 index 사용 X : 고유한 키로 사용