웹 개발에서 우린 자주 이 단어를 접하게 된다
돔 이라고도 부르고 알파벳 하나씩 끊어부를때도 있고...
뭐 여러 경우로 부르게 된다.
오늘 주제는 버추얼돔..그게 무엇인가 이다.
DOM은 줄임말이고 원래의 이름은 Document Object Model 이다
웹페이지의 구조를 대략적으로 나타내는 트리 구조이다
https://developer.mozilla.org/en-US/docs/Web/API/Document_Object_Model/Introduction
Introduction to the DOM - Web APIs | MDN
The Document Object Model (DOM) is the data representation of the objects that comprise the structure and content of a document on the web. This guide will introduce the DOM, look at how the DOM represents an HTML document in memory and how to use APIs to
developer.mozilla.org
뭐 자세한 설명은 위의 사이트를 참고하는게 더 정확하고
React의 버추얼 돔에 대해 설명하겠다.
간혹 백엔드 분들에게 React의 버추얼돔은 왜쓰는걸까요? 라는 질문을 종종 받을때가 있다.
전통의 방법대로 만든 웹페이지들은 페이지의 내용이 바뀔 경우 페이지 전체를 불러와야하는것을 알고있다.
단지 이 행동은 성능적인 면에서도 뛰어나지 못하지만 UX적인 면에서도 끔찍하다 만약 여러분이 페이지 내용이
실시간으로 업데이트 될때마다 생각해보자 그런데..매번 새로고침이 된다!
이는 끔찍한 유저 경험으로 그렇게 썩 좋지 못한 경험을 전달한다.
이를 보안하고자 React는 버추얼 돔을 도입하여 가상돔의 변경된 부분만을 빠르게 반영하여 해당 컴포넌트 부분만 다시
불러오는 경우로 좋은 유저 경험을 제공한다.
원랜 diff니 버추얼 돔이 2개의 비교 방법 뭐 등등 많지만 미리 나중에 쓸 내용을 정리하고자 대충 이런게 있다라는 느낌으
로 정리했다.
'잡동사니 > 개발관련잡담' 카테고리의 다른 글
| 이클립스가 어느날 먹통이 되어버린 건에 대해 (0) | 2024.05.22 |
|---|---|
| 가만 생각해봤는데 왜 개발자들 맥에 환장하는거임?? (0) | 2023.12.14 |
| 타입스크립트 과연 슈퍼셋인가 (0) | 2023.09.08 |
| next js가 진정한 미래인가? (0) | 2023.04.09 |
| 앞으로 개발과 관련된 글이 올라갈 예정 (0) | 2022.07.19 |