1. immutable (불변성 )
즉 Elements가 불변성의 특징을 가진다는 것은 Elements 생성후에는
chiledren이나 attributes를 바꿀 수 없다는 것을 의미한다.
붕어빵틀에 붕어빵속에 슈크림이 들어가던 팥이 들어가던 틀어 구워져서 만들어지기 전에는
다양한 붕어빵이 될 수 있지만 한번 슈크림이 들어가서 구워지면 그 속을 다시 팥으로 바꿀 수 없는 것과 마찬가지이다.
2. Root DOM Node
<div id="root"></div>
모든 리액트 앱은 단 하나의 Root DOM Node를 가지게 된다.
반면에 기존에 있던 웹사이트에 추가적으로 React를 연동하게되면 여러개의 분리된 수많은 Root DOM node를 가지게 될 수 도 있다.
Root dvi에 실제로 React Elements를 랜더링 하기 위해서는 다음과 같은 코드가 실행되어야한다.
ReactDOM.render(element, document.getElementById('root'));
ReactDOM.render() 라는 함수는 element를 받아서 root dom node에 렌더링해주는 것이다.
여기서도 알 수 있다시피 React Element와 DOM Element는 서로 다른 개념이라는 것을 알 수 있다.
(ReactElement는 Virtual DOM에 존재하는 것이고 DOM Elements는 실제 브라우저에 존재하는 것이다.
React Element가 랜더링되는 과정은 결국 Virtual DOM에서 실제 DOM으로 이동하는 과정이라고 볼 수 있다.
'React' 카테고리의 다른 글
React - props (0) | 2022.08.29 |
---|---|
React - 기본예제) 시계 만들기 (0) | 2022.08.29 |
React - Rendering Elements와 React.createElements() 함수에 대해서 (0) | 2022.08.28 |
JSX의 개념과 장점 (0) | 2022.08.28 |
SPA(SinglePageApplication) 와 React에 대해서 (0) | 2022.08.27 |