자바스크립트 엔진의 대표적 예로는 google V8 엔진이 있다.V8엔진은 chrome, nodeJS에서 주로 사용한다.
V8 엔진
V8엔진에는 주로 메모리힙과 콜스택으로 이루어져 있다.memory heap: 메모리 할당이 일어나는 곳call stack: 코드 실행에 따라 호출 스택이 쌓이는 곳
런타임
프로그램이 실행되고 있는 때 존재하는 곳을 의미한다.
web browser에서 작동하는 자바스크립트 측면도 있고 node.js라는 환경에서 구동되는 측면이 존재한다.browser와 node.js를 런타임이라고 볼 수 있다.
자바스크립트 엔진 외에 dom,ajax,setTimeout과 깉이 브라우저에서 제공해주는 api를 Web API라고 한다.
호출스택
자바스크립트는 싱글 쓰레드 기반 언어이다.
호출스택은 프로그램 상에서 어디에 있는지 기록하는 자료구조이다.
호출스택에 쌓인 함수들이 차근차근 위에서부터 실행이 된다.
초반에 리액트 공부를 시작했을 때 setState가 계속 실행이 되었을 때 아래와 같은 스택 허용치 넘는 에러가 자주 났었다…
동시성 & 이벤트 루프
호출 스택에서 시간이 엄청 오래걸리는 함수가 있으면 브라우저는 그 동안 아무런 작업을 못하고 대기상태가 된다.
결국 에러를 띄우면서 페이지 종료 팝업이 뜬다.
(과거 파일뷰어에서 200-300장이 넘는 이미지 파일들을 렌더링할 때 났던 에러였다…)
페이지 렌더링 동작을 방해하지 않고 브라우저의 응답도 끊지 않으면서 연산량이 많은 코드를 그러면 어떻게 실행해야할까??
답은 비동기 콜백이다!
과거에는 ajax를 사용하여 콜백함수로 처리했다.
그러다보니 콜백 지옥에 빠지기도 하고 가독성도 떨어지고 수정하기도 힘들었다.
그래서 나온 것들이 promise,async 등이 있다.