React.js

React는 웹 프레임워크로, 자바스크립트 라이브러리의 하나로서 사용자 인터페이스를 만들기 위해 사용된다.출처 : 위키백과

Why React.js ?

React 는 Component 기반의 UI 라이브러리

• 만약 Header 요소에 문제가 생겨서 수정해야 되는 상황이면
• 기존 방식은 Header 를 포함하고 있는 모든 파일을 수정해야 됩니다.
• 하지만 컴포넌트화 방식은 컴포넌트가 정의된 파일 하나만 수정하면다른 페이지들은 자동으로 수정 됩니다.
• 즉, 공통으로 사용되는 요소의 수정 사항이나, 문제가 발생 했을 경우 수정하기 수월하고,유지보수가 좋아집니다.

React 는 선언형 프로그래밍

• 프론트엔드 측면에서 오른쪽의 선언형 프로그래밍이 요즘 시대에 더 각광 받고 있습니다.

Virtual DOM ( 가상 돔 )

• DOM : 브라우저가 실제로 사용하는 객체
  
• DOM 의 흐름
  
• DOM 에서 변화가 일어날 때 마다 위의 작업이 계속 반복 됩니다.
• 잦은 업데이트에서 필요 이상의 연산이 필요하고, 성능 저하의 문제로 이어집니다.
• Virtual DOM
  
• 기존의 발생하는 변화를 실시간으로 실제 DOM (화면에 나타나는 DOM) 에 업데이트 하지 않고
• 가상의 DOM 을 업데이트 후( 화면에 실제로 그리지는 않습니다.)
• 업데이트 해야할 부분을 모아서 한 번에 실제 DOM에 업데이트 하는 방식으로 과다 연산을 해결 할 수 있습니다. ( 5번 업데이트 해야할 일을 -> 1번에 해결 한다! )

참고

• 인프런