리액트를 사용하는 이유 [Today I Learned - React]

리액트를 사용하는 이유?!

 

리액트를 사용하면 좋은 이유

01.  웹을 APP 처럼 사용할 수 있음

•  모바일 앱으로 발행이 쉬움

 

 

02. 이벤트 업데이트 관리가 쉬움

 

JS 이벤트 업데이트 방식

• JS 로 DOM 에 접근하여 이벤트를 하나하나 핸들링 하려면, 프로젝트 사이즈에 따라 관리하기가 어려워 질 수 있음
• 이벤트가 많아지면, DOM 이 다양해지고, 업데이트 규칙도 복잡하게 됨

출처 : https://react.vlpt.us/

 

React 이벤트 업데이트 방식

• 어떠한 상태가 바뀌었을 때 그 상태에 따라 아예 리랜더링 되도록 설계가 되어있음 
  • 아예 리랜더링 하면 속도가 느려지지 않나? => Virtual DOM 으로 해결!! 
  • 어떻게 업데이트를 할 지에 대한 고민이 필요 없음
• Virtual DOM : 가상의 DOM
  • 메모리에 가상을 존재하는 DOM == JS 객체와 같음
  • 작동 성능이 실제로 브라우저에서 DOM 을 보여주는 것 보다 속도가 훨씬 빠르다

 

1. 리액트 상태가 업데이트 되면
2. 업데이트가 필요한 곳의 UI 를 Virtual DOM 을 통해 랜더링
3. 비교 알고리즘을 통해 실제 브라우저에 보여지고 있는 DOM 과 비교를 한 후, 차이가 있는 곳을 감지하여
4. 이를 실제 DOM 에 패치 시킴

==> 업데이트 고민도 없애면서, 빠른 성능을 지킬 수 있음

 

 

공부 참고 사이트

 

https://react.vlpt.us/