자바스크립트 엔진이란? 렌더링 엔진이란? :: 마이구미

이번 글은 자바스크립트 엔진(Javascript Engine)과 렌더링 엔진(Rendering Engine)에 대해 다뤄본다.

정의와 오해를 알아본다.

자바스크립트 엔진이란 무엇인가?

자바스크립트 코드를 실행하는 인터프리터 또는 프로그램이라고 볼 수 있다.

전형적인 인터프리터의 역할 및 JIT 컴파일 활용 및 많은 기능을 하고, 주로 웹 브라우저를 위해 사용된다.

대중적으로 알려진 자바스크립트의 엔진은 구글의 V8이라고 들어봤으리라 생각한다.

Node.js에서 사용되는 엔진이기도 하다.

엔진의 종류로는 아래와 같다. (이미 잘 알려진 브라우저를 기준)

• Rhino - 모질라
• SpiderMonkey - 파이어폭스
• V8 - 구글, 오페라
• JavascriptCore - 사파리
• Chakra - 익스플로러, 마이크로소프트 엣지

간혹 자바스크립트의 엔진은 V8이라고 생각하는 사람들이 있다.

위와 같이 엔진은 많이 존재한다.

구글의 엔진이자, Node.js에서도 V8를 택했기 때문에 오해가 생겼으리라 생각한다.

렌더링 엔진이란 무엇인가?

웹 렌더링 엔진(Web Rendering Engine) 또는 웹 브라우저 엔진(Web Browser Engine) 또는 웹 레이아웃 엔진(Web Layout Engine)이라고 불린다.

렌더링, 브라우저, 레이아웃 단어 그대로 웹 페이지에 대한 컨텐츠 및 데이터를 위해 동작하는 엔진이다.

렌더링 역할을 하는 엔진이 브라우저마다 다르기 때문에 같은 페이지가 다르게 보이는 경우가 있다.

또한, CSS에서는 아래와 같은 코드를 볼 수 있다.

-moz-border-radius: 2em;
-ms-border-radius: 2em;
-o-border-radius: 2em;
-webkit-border-radius: 2em;

렌더링 엔진의 종류로는 아래와 같다.

• Gecko - 모질라, 파이어폭스
• Blink - 구글, 오페라
• Webkit - 사파리
• Trident - 익스플로러
• EdgeHTML - 마이크로소프트 엣지

* Blink는 구글이 Webkit을 대체하기 위한 자체적으로 개발한 차세대 엔진이다.

결론은, 자바스크립트 엔진과 렌더링 엔진은 서로 다르기 때문에 숙지하자.

렌더링 엔진에 대한 비교

https://www.kics.or.kr/storage/paper/event/2015_summer/publish/14C-26.pdf