브라우저 엔진, 자바스크립트 엔진

개념 정리하기

브라우저 엔진 (렌더링 엔진)

웹페이지의 HTML과 CSS를 파싱하고 해석하여 화면에 실제로 배치하고 그려주는(렌더링) 역할을 함.

종류:

• Blink (Chrome, Edge 등)
• WebKit (Safari)
• Gecko (Firefox)

자바스크립트 엔진

자바스크립트 코드를 해석하고 실행 가능한 기계어 코드로 변환하여 실행하는 엔진.
브라우저나 Node.js 같은 런타임 환경 내에서 동작하며, 각각의 환경이 제공하는 API를 통해 웹페이지나 서버 프로그램의 JavaScript를 실행함.

종류:

• V8 (Chrome, Edge, Node.js 등)
• JavaScriptCore (Safari)
• SpiderMonkey (Firefox)

두 엔진의 관계

1. 브라우저 엔진이 HTML과 CSS를 처리하여 페이지의 구조(DOM)를 만들고 화면을 그림
2. 자바스크립트 엔진이 JavaScript 코드를 실행하며, 이 코드가 DOM(Document Object Model)을 통해 브라우저 엔진이 만든 웹페이지 구조와 상호 작용할 수 있도록 연결됨

예를 들어, JavaScript 코드가 "이 버튼을 클릭하면 텍스트 색상을 빨간색으로 변경"을 지시하면, 자바스크립트 엔진이 이 코드를 실행하고 브라우저 엔진에 해당 변경 사항을 적용하도록 요청함.

즉, 브라우저 엔진은 HTML/CSS를 화면에 시각화하는 역할을, 자바스크립트 엔진은 JavaScript를 실행하여 페이지에 동적인 기능을 부여하는 역할을 담당함.

주요 브라우저별 엔진 조합

브라우저	렌더링 엔진	자바스크립트 엔진
Google Chrome, Microsoft Edge, Opera, Naver Whale, Samsung Internet	Blink	V8
Mozilla Firefox	Gecko	SpiderMonkey
Apple Safari	WebKit	JavaScriptCore

Chromium 프로젝트란

Chromium은 Google이 주도하는 오픈소스 브라우저 프로젝트로, 단순히 하나의 엔진이 아니라 브라우저를 구성하는 여러 엔진과 컴포넌트들의 집합체라고 할 수 있음.

Chromium (브라우저 전체 프로젝트)
 ┣ Blink        → 렌더링 담당 (HTML/CSS → 픽셀)
 ┣ V8           → JS 실행 담당 (코드 → 머신코드)
 ┣ Network Stack → HTTP 요청/응답
 ┣ GPU Process   → 하드웨어 가속
 ┗ UI, Input 등  → 브라우저 사용자 인터페이스 및 상호작용

Chromium 구성 요소 상세

구성 요소	역할	상세 설명
Blink	렌더링 담당	HTML, CSS를 파싱하여 DOM 및 CSSOM 트리를 구성하고, 이를 바탕으로 웹 페이지를 최종적으로 화면의 픽셀로 변환함
V8	JS 실행 담당	JavaScript 코드를 중간 바이트코드로 변환한 뒤, JIT(Just-In-Time) 컴파일러를 이용해 고성능의 머신 코드로 컴파일 및 실행함
Network Stack	HTTP 요청/응답 처리	웹 서버와 통신하며, HTTP/HTTPS 요청을 보내고 응답을 받아오는 네트워킹 기능을 처리함
GPU Process	하드웨어 가속	렌더링된 내용을 화면에 그리는(Compositing) 과정이나 3D 그래픽 처리 시, CPU 대신 GPU를 활용하여 성능을 가속함
UI, Input 등	사용자 인터페이스 및 상호작용	탭, 주소 표시줄, 설정 화면 등 브라우저의 전반적인 UI를 관리하고, 마우스나 키보드 같은 사용자 입력을 처리함

Chromium vs Chrome

"Chromium은 오픈소스 엔진 프로젝트, Chrome은 그 위에 Google이 기능을 얹은 제품"이라 할 수 있음.

항목	Chromium	Google Chrome
소속/관리 주체	오픈소스 프로젝트 (Google + 커뮤니티)	Google이 배포하는 상용 브라우저
기능 범위	최소한의 기능만 포함 (기본 탭, 주소창 등)	북마크 동기화, 자동 업데이트, DRM(Widevine), Google 로그인, 확장 프로그램 스토어 등 Google 독점 기능 추가
배포 방식	개발자가 직접 소스코드를 빌드해야 함	일반 사용자를 위해 Google이 패키징하여 배포 (자동 업데이트 포함)