How JavaScript Works
자바스크립트의 동작원리: 엔진, 런타임, 호출 스택
자바스크립트 엔진
대표적인 예는 Google V8 엔진. V8은 Chrome과 Node.js에서 사용
엔진의 주요 구성요소
Memory Heap : 메모리 할당이 일어나는 곳
Call Stack : 코드 실행에 따라 호출 스택이 쌓이는 곳
런타임
거의 모든 개발자들이 setTimeout과 같은 브라우저 내장 API를 사용하지만 이 API를 자바스크립트 엔진에서 제공하지는 않음
자바스크립트에 관여하는 요소들
자바스크립트 엔진
Web APIs (DOM, AJAX, Timeout)
Event Loop, Callback Queue
호출 스택(Call Stack)
자바스크립트는 기본적으로 싱글 쓰레드 기번언어로 호출 스택이 하나. 따라서 한 번에 한 작업만 처리할 수 있음
호출 스택은 우리가 프로그램 상에서 어디에 있는지를 기록하는 자료구조
함수를 실행하면 해당 함수는 호출 스택의 가장 상단에 위치하고 함수 실행이 끝나면 해당 함수를 호출 스택에서 제거
하는 것이 스택의 역할
호출 스택이 최대 크기가 되면 스택 날려 버리기가 일어남(Overflowing)
-> 싱글 스레드 기반 코딩은 멀티 스레드 환경에서 제기되는 복잡한 문제나 시나리오를 고민하지 않아도 되기 때문에 쉬움(ex, 데드락) -> 그러나 싱글 스레드에서 코드를 실행하는 건 상당히 제약이 많음 -> 한 개의 호출 스택을 갖고 있는 자바스크립트의 실행이 느려진다면?
동시성(concurrency) & 이벤트 루프(Event Loop)
호출 스택에 처리 시간이 매우 오래 걸리는 함수가 있다면,
함수가 실행되는 동안 브라우저는 아무 작업도 못하고 대기 상태가 됨
페이지 렌더링 동작을 방해하지 않고 브라우저의 응답도 끊지 않으면서 연산량이 많은 코드를 실행하려면,
비동기 콜백
210913
자바스크립트에서 비동기 처리가 왜 중요한지 알 수 있었다. 자바스크립트의 작동 방식에 대해 좀 더 알아보면 좋을 것 같다.
Last updated