6주차 위클리 페이퍼🐻‍❄️

이주영·2024년 1월 1일
0

리액트에서 Virtual DOM이 무엇인지, 이를 사용하는 이유는 무엇인지 설명해 주세요.

Virtual DOM이란 실제 DOM에 접근해 조작하는 대신 이를 추상화해 자바스크립트 객체를 구성해 사용한다.
리액트에서는 실제 DOM의 변경사항을 빠르게 파악하고 반영하기 위해 내부적으로 실제 DOM의 복사본이라 할 수 있는 Virtual DOM을 만들어 관리한다.
데이터가 업데이트되면 전체 UI를 Virtual DOM에 리렌더링한다. 그리고 이전 Virtual DOM과 업데이트 후의 Virtual DOM을 비교해 변경된 부분만 실제 DOM에 적용한다.
이렇게 하면 전체 UI를 리렌더링할 필요가 없이 효율적으로 업데이트할 수 있고 빠르게 화면을 보여줄 수 있어 렌더링 성능이 향상되고 DOM 조작이 최소화된다.

리액트에서 배열을 렌더링할 때 key를 써야 하는 이유에 대해 설명해 주세요.

key는 element list를 만들 때 포함해야 하는 특수한 문자열 attribute이다. key는 리액트가 어떤 항목을 변경, 추가, 삭제할지 식별하는 것을 돕는다. 즉 배열이 업데이트되는 과정에서 효과적인 렌더링을 수행하기 위해 고유한 key 값을 사용해야 한다.

0개의 댓글