Rendering Engine vs Javascript Engine
Rendering Engine
- HTML, CSS로 작성된 마크업 코드들을 콘텐츠로서 웹 페이지에 렌더링 하는 역할
Javascript Engine
- Javascript로 작성한 코드를 해석하고 실행하는 인터프리터
Javascript Engine
- Call Stack
- Task Queue(Event Queue)
- Heap
Call Stack
- 자바스크립트는 단 하나의 호출 스택을 사용함.
- 하나의 함수가 실행되면, 이 함수가 끝날 때 까지는 다른 어떤 함수도 실행될 수 없음.
- 요청이 들어올 때마다 해당 요청을 순차적으로 호출 스택에 담아 처리한다.
Task Queue(Event Queue)
- 자바스크립트 런타임 환경에서 처리해야하는 Task들을 임시 저장한는 대기 큐이다.
- Call Stack이 비었을 때, 먼저 들어온 순서대로 수행하게 된다.
- 자바스크립트에서 비동기로 호출되는 함수들은 Task Queue에 오게 된다.
- 이벤트에 의해 실행되는 함수(핸들러), 자바스크립트 엔진이 아닌 Web API영역에 따로 정의되어있는 함수들이 비동기로 실행된다.
Heap
- 동적으로 생성된 객체(인스턴스)는 힙에 할당된다.
- 대부분 구조화되지 않은 '더미'같은 메모리 영역을 heap이라 부른다.
