Vanilla JS, 바닐라 자바스크립트의 필요성 요약

jQuery는 자바스크립트의 라이브러리이다. 제이쿼리는 쉬운 문법으로 많은 사랑을 받았지만, 어느순간 의존도가 확 줄어들었다. 그 이유 중 하나는 자바스크립트의 지속적인 개선이었고 바닐라 자바스크립트로 대부분의 기능이 구현되는 것이다. 무엇보다도 가상 돔(Virtual DOM)을 사용하는 라이브러리가 등장해서 바닐라 자바스크립트로 개발하는 사례가 늘었다. 가상 돔을 이용한 대표적인 프레임워크로는 React, Vue.js, Angular 가 있다. 이러한 프레임워크에서 가상 돔을 이용할 때 제이쿼리를 쓰면 스크립트랑 충돌 가능성이 높다. 가상돔을 이용하는 프레임워크는 DOM을 갱신하는 같은 목적이 있고 이는 제이쿼리와 역할이 비슷하다. 같은 목적의 도구를 이중으로 사용할 필요가 없기 때문에, 스크립트와 제이쿼리를 같이 쓰는 경우는 거의 없다. 물론 제이쿼리를 사용 못하지는 않지만, 되도록 바닐라 자바스크립트로 코딩을 하는 경향이 생겼다. 

 

Virtual DOM 가상 돔의 필요성

여기서 가상 돔, Virtual DOM은 어떻게 생겨났을까?

인터렉티브한 웹페이지는 브라우저 내 DOM 표준 형식으로 Parsing(파싱)되는데, 이러한 DOM 조작이 많아질수록 브라우저 성능이 낮아진다. 이것을 해결하기 위해 등장한 것이 Virtual DOM 가상 돔 이다.

메모리에 가상 돔을 만들고 실제 돔과 비교하며 작업한다. 이후 수정된 부분은 실제 돔에 적용하며 활용하는 방식이다. 이러한 가상 돔은 제이쿼리랑 비교하면 훨씬 생산적이다. 

 

출처 

Vanilla JS, 선택일까 필수일까