1. create HTML from an array of data

배열 안의 데이터를 HTML로 바꾸는 방법에는 두 가지가 있다. 

 

1. createElement 방식

 

createElement () 메서드를 이용해 요소를 만들고 appendChild() 메서드를 이용해 DOM에 넣는 방식이다.

 

하지만 이렇게 할 경우 만약 수 많은 데이터를 읽어와야한다면 DOM에 접근 하는 속도는 굉장히 느려질 것이다.

그이를 개선하는 방법이 바로 fragment를 이용하는 것이다.

 

 2. createElement 방식에 fragment 추가 

 

✅ fragment 란?  

 

결론부터 말하자면 fragment 또한 node 이다. 그러나 어느 것에도 속하지 않는다. 심지어 DOM tree에도 속하지 않는다.덕분에, createElement() 에 비해 작업하는 속도가 빨라진다. 

 

✅ 작동 방식 

 

기존에 createElement()를 이용하던 방식에 fragment를 만들어 DOM에 추가하는 조금의 수고스러움을 더하면 된다. 

 

출력값