Front-end/React.js
[React.js] React가 필요한 이유
잔디🌿
2023. 8. 9. 18:37
1.컴포넌트화 방식
중복코드를 수정해야 할 상황이 생겼을 때 하나하나 일일히 수정하기에는 어려움이 있다.
리액트는 재사용해야하는 요소들을 컴포넌트 방식으로 사용할 수 있다. 이를 컴포넌트화 방식이라고 한다.
이 방식을 사용하면 중복코드를 수정할 때 용이하다.
2.선언형 프로그래밍
+버튼을 누르면 화면의 숫자가 증가하고, -버튼을 누르면 감소하는 프로그램을 만든다고 하자.
명령형 프로그래밍 방식으로 만들었을 때는
1.결과를 표시할 요소를 가져온다
2.현재 결과값을 숫자형으로 바꾼다.
3. +라면 더해서, -라면 빼서 다시 상수에 값을 넣는다.
선언형 프로그래밍 방식으로 만들면
1. +를 누르면 ,result값에 +1을 하고 minus를 누르면 반대로 한다.
선언형 프로그래밍이 훨씬 간단하다. 리액트는 선언형 방식을 사용하기 때문에 간단하게 프로그래밍 할 수 있다.
3.virtual DOM
DOM은 문서 객체 모델이다. 사이트는 html을 해석해서 보여주는데, 이 html을 해석이 쉽게 트리 형태로 만들어둔다.
그리고 Dom은 이러한 과정을 거쳐 화면에 표시된다.
Dom을 계속 변경하게되면 브라우저는 위 과정을 계속 반복해야해서 불필요한 연산을 많이 해야한다.
가상의 돔에 한번에 업데이트해서 과다현상의 해결할 수 있다.