본문 바로가기

기술면접

22_VanillaJS와 비교하여 리액트를 사용하는 이유

VanillaJS는 JavaScript의 순수한 형태를 말합니다. 즉, 어떠한 라이브러리나 프레임워크 없이 순수 JavaScript만을 사용하여 웹 애플리케이션을 개발하는 것을 의미합니다. 이것은 HTML과 CSS와 함께 기본적인 웹 개발을 수행하는 것을 말합니다.

반면에 리액트(React)는 Facebook에서 개발한 JavaScript 라이브러리로, 사용자 인터페이스를 만들기 위한 목적으로 만들어졌습니다. 

1️⃣ 컴포넌트 기반 구조:
리액트는 컴포넌트 기반 아키텍처를 사용하여 UI를 개발합니다. 이는 UI를 독립적이고 재사용 가능한 작은 조각으로 나누어 개발할 수 있게 합니다. 각 컴포넌트는 자체적으로 상태(state)와 생명주기(lifecycle)를 가지며, 필요한 경우 재사용할 수 있습니다. 반면 VanillaJS는 이러한 컴포넌트 기반 아키텍처를 가지고 있지 않습니다.


2️⃣ 가상 DOM:
리액트는 가상 DOM(Virtual DOM)을 사용하여 성능을 최적화합니다. 가상 DOM은 실제 DOM에 대한 가벼운 복제품으로, 리액트는 상태 변화가 발생할 때마다 전체 DOM을 다시 그리는 대신에 이를 비교하고 변경된 부분만을 실제 DOM에 반영합니다. 이로 인해 불필요한 DOM 조작을 최소화하고 렌더링 속도를 향상시킵니다. 반면 VanillaJS는 가상 DOM을 사용하지 않으며, DOM 조작을 직접 수행합니다.


3️⃣ 단방향 데이터 흐름:
리액트는 단방향 데이터 흐름을 따르며, 상태가 부모 컴포넌트에서 자식 컴포넌트로만 전달됩니다. 이는 데이터 흐름이 예측 가능하고 디버깅이 쉽게 만들어 줍니다. 반면 VanillaJS는 데이터 바인딩이나 상태 관리에 대한 별도의 내장 기능이 없으며, 개발자가 직접 구현해야 합니다.
요약하면, VanillaJS는 순수 JavaScript를 사용하여 웹 개발을 진행하는 것이며, 리액트는 UI 개발을 위한 라이브러리로서 컴포넌트 기반 아키텍처와 가상 DOM 등의 기능을 제공합니다.

 

요약하면, VanillaJS는 순수 JavaScript를 사용하여 웹 개발을 진행하는 것이며, 리액트는 대규모 애플리케이션 개발에 특히 유용하며, 효율적인 UI 개발을 위한 많은 도구와 라이브러리가 리액트 기반으로 개발되고 있습니다.