본문 바로가기

Dev/[Javascript]

[Javascript] 자바스크립트의 컴파일에 대하여

반응형

 

INTRO


 

자바스크립트 언어는 순차적으로 런타임에 실행되는 인터프리터 언어이다.

그러나 C언어 처럼 컴파일되기도 한다.

이 포스팅에서는 이 내용에 대해 포스팅한다.

 

 


 

1. 인터프리터?

- 자바스크립트는 인터프리터 언어로 분류된다.

- 런타임에 한 줄씩 순차적으로 수행된다.

- 물론 무작정 순차적으로 실행되는 것은 아니다.

- 특정 단계가 있고 이 단계로 인해 호이스팅이라는 개념도 생겨난다.

 

- 전처리가 없다.

- 전처리가 없기 때문에 개발 단계에서 버그를 먼저 잡기가 힘들다.

- 그래서 나온 것이 타입스크립트와 각종 Linter, Formatter들이다.

 

- 초창기 자바스크립트는 HTML을 동적으로 만들고자 고안된 언어이다.

- 이 시기엔 Server Side Rendering 방법이 지배적이었다. 브라우저는 웹 서버 만큼의 로직을 처리할 수 없었다.

- 기술이 점차 발전함에 따라 브라우저 수준의 자바스크립트 엔진에서도 많은 일을 빠르게 처리할 수 있게 되었다.

- 브라우저 없이 동작하기도 한다.(Common JS)

- 이 과정에서 자바스크립트도 효율적이고 빠르게 동작하게 하기 위해 2008년(비교적 최근이다) Google V8엔진에서 컴파일러를 도입하기 시작했다.

 

2. 컴파일러?

- 컴파일러는 자바스크립트 코드를 바이트코드로 변환하여 처리한다. 캐싱도 해서 효율이 좋다.

- Google V8엔진 이후 다른 브라우저도 컴파일러를 도입하기 시작한다.

- 컴파일러는 소스코드를 토크나이징 하고, 이 토큰들을 구문적으로 해석하여 트리를 구성하는 일련의 과정을 수행한다. 이렇게 생성된 트리는 AST(추상 구문 트리)라고 한다.

- 구문 구조, 제어 흐름, 변수 선언 등의 정보를 전부 담고 있는 이 트리를 분석하고 변환 작업 수행하는 것이 컴파일이라고 보면 된다.

 

- AST는 Babel을 설명할 때도 등장하는데, 여기서 헷갈릴 수 있는 포인트.

Babel도 컴파일러로 종종 불리는데, 정확히 말하면 source to source 컴파일러 혹은 트랜스파일러(Transpiler)이다.

브라우저 엔진의 컴파일과는 전혀 다른것이며 수행되는 레벨도 다르다.

babel은 소스 레벨에서 라이브러리로 동작하여 사용자의 설정에 따라 자바스크립트 코드를 이전 버전의 브라우저에서도 동작하도록 변환해주는 역할이다. 이 변환은 문법의 변경, 기능의 추가, 호환성의 유지 등이 목적이다.

이렇게 변환 된 소스코드가 브라우저에서 엔진에 의해 바이트코드로 변환되는것이 컴파일이다. 이 변환의 목적은 엔진의 효율적 처리.

 

 

 

 

-퍼가실 때는 출처를 꼭 같이 적어서 올려주세요!

 

반응형