[React Basic] 컴포넌트를 하나의 요소로 감싸는 이유

게시글은 리액트 공부용이며 출처를 제시합니다.
출처: 소플의 처음 만난 React, 리액드를 다루는 기술, 모던 자바스크립트 deep dive

⛳ 왜 컴포넌트를 하나의 요소로 감싸줘야 하나?

Virtual DOM에서 컴포넌트 변화를 감지할 때 효율적으로 비교할 수 있도록 컴포넌트 내부는 하나의 DOM 트리 구조로 이루어져야 한다는 규칙이 있다.

⛳ div가 아닌 Fragment 사용 가능

import {Fragment} from 'react';
return(
	<Fragment>
  		<h1>hey yo</h1>
  	</Fragment>
)
//or without importing Fragment
return(
	<>
  		<h1>hey yo</h1>
  		<h1>what's up</h1>
  	</>
)