[FE] Vanilla Javascript로 가상돔(VirtualDOM) 만들기

글이 좋아서 링크를 통해 공유합니다.

1. 브라우저 로딩 과정

   1. 파싱
   2. 스타일
   3. 레이아웃
   4. 페인트
   5. 합성

2. 성능

   • Reflow, Repaint
   • 브라우저에서 제일 성능을 많이 잡아먹는 것

3. 가상돔(VirtualDOM)

   • 가상돔 만들기
   • JSX
   • 가상돔을 리얼돔으로
   • Diff 알고리즘을 통해 가상돔 성능 UP

4. VirtualDOM 대한 고찰

   • 가상돔이 꼭 필요한가?
   • Diff 알고리즘 수정

5. Diff 알고리즘 + 컴포넌트

   • 컴포넌트 구성
   • 이벤트 중복등록 해결