[React] 입문 / React가 필요한 3가지 이유

Component 기반의 UI 라이브러리

 

여러개의 페이지에서 공통적으로 사용하는 요소들을 하나의 Component 라는 모듈로 정의하여 유지보수 용이

기존방식은 Header 부분에 수정할 소스가 있다면, 두가지의 파일(Index.html, about.html) 모두를 수정해야 하지만 컴포넌화 방식은 컴포넌트가 정의된 파일(module.js) 하나만 수정하면 해당 파일을 불러와서 쓰는 파일들은 자동으로 수정이 된다.

 

 

선언형 프로그래밍

 

 

 

명령형 프로그래밍 : 코드로 원하는 결과를 어떻게(How) 달성하는지, 과정에만 관심을 두는 프로그래밍
 - 절차를 하나하나 다 나열 / jQuery

선언형 프로그래밍 : 코드로 원하는 결과가 무엇(What) 인지, 필요한것이 어떤것이지 기술하는 프로그래밍
- 목적을 바로 말함 / React

 

 

Virtual DOM

 

 

 

DOM(Domcument Object Model)
문서 객체 모델

DOM 을 자주 조작하는 것은 필요 이상의 연산(반복적인 렌더링, 레이아웃 재계산 등)을 하게되어 브라우저의 성능저하를 야기한다.


Virtual DOM
가상 돔

자바스크립트를 사용할 때, 실제 DOM 을 조작하는 것이 아니라 먼저 가상의 DOM에 적용시키고, 그 결과를 실제 DOM 에 전달하여 불필요한 연산을 줄이고 브라우저의 성능을 개선시킨다.