왜 리액트를 쓸까?

컴포넌트 기반

React는 별도의 컴포넌트를 만들어 쉽게 재사용을 할 수 있다.
이로인해,

• 반복작업이 줄어든다.
• 유지보수가 용이해진다.
• 여러 개발자가 하나의 페이지를 만들어도 효율적인 코드 분리가 가능하다.

선언형 프로그래밍

기존 바닐라 스크립트는 명령형 프로그래밍 방식이다. 프로젝트의 규모가 커지면 코드가 너무 길어지고 많은 DOM 요소의 변화를 개발자가 직접 관리하는 것은 비효율성을 야기시킨다.

리액트는 선언형 프로그래밍 프레임워크로써 DOM 관리와 상태 변화 관리를 최소화하고 기능개발,사용자 인터페이스에 보다 더 집중 할 수 있다.

Virtual DOM

DOM 이란?

Document Object Model, HTML을 객체화 한 것을 의미한다.
HTML 문서를 브라우저가 이해할 수 있도록 만든 Tree 자료구조이며 계층적 구조와 정보를 표현한다.

Virtual DOM 이란?

실제 DOM에 접근하여 조작하는 대신 추상화시킨 자바스크립트 객체를 이용해 사용한다.
실제 DOM을 사용하면 한가지의 변화만 일어나도 렌더링 과정을 거쳐야해서 메모리 누수나 속도적인 부분에 문제가 생길수도 있다.
이러한 문제들을 해결하기 위해 변화 전의 가상돔과 변화된 가상돔을 비교하여 레이아웃 계산을 한번만 이행한다.