Javascript: 코드의 분석과 컴파일링

출처: Udemy Javascript 완벽 가이드

 

 

1. 코드를 HTML 파일에 임포트 하면 브라우저가 해당 HTML을 읽는 작업을 함

 

• 스크립트를 감지하여 임포트 함
• 브라우저가 스크립트를 HTML 혹은 HTML로 작성된 인라인 스크립트를 실행함

 

 

 

 

2. 브라우저가 스크립트를 분석(parsing)하고 실행함

 

 

2-1. Parsing 단계

• parsing(분석): 브라우저가 Javascript 코드를 읽어 들여서 로딩하는 작업.
• 실행은 실제로 일어나는 과정으로 코드가 영향력을 발휘하는 단계.
• 브라우저는 Javascript 엔진을 이용하게 되는데 모든 주요 브라우저에는 해당 기능을 지원함.
• Google 브라우저인 Chrome에서는 v8, Firefox에서는 Spider Monkey와 같은 엔진이 분석과 실행을 도맡음
• 대부분 interpreter와 compiler의 두 부분으로 나뉨. 이때 컴파일러는 JIT 컴파일러임.

 

 

 

---

JIT 컴파일러

 

 

 

출처: https://catch-me-java.tistory.com/11

 

 

이미 한번 읽어서 기계어로 변경한 소스코드는 저장해 두고 다시 번역하지 않음
정확히는 반복되는 코드를 모두 컴파일러로 컴파일 시키는거다.
그래서 인터프리터의 역할을 보조 해준다고 생각하면 되는데, 이전 실행과 현재 실행 시 달라진 부분이 없는 코드의 경우에는 재컴파일링을 거치지 않고 컴파일된 코드를 다시 사용하게 된다.

 

 

---

2-2. Interpreter 단계

• 스크립트를 로드하고 실행을 시작함.
• 이 작업을 인터프리터가 수행함.
• 인터프리터가 스크립트를 로드하고 읽어 들여서 이를 실행하기에 좀 더 쉬운 바이트 코드로 변환한 다음 스크립트 실행을 시작함.
• 인터프리터는 스크립트를 실행할 때 최적화된 방식으로 한 줄씩 실행하는데 스크립트 실행이 이루어지지만 가장 빠른 방식으로 실행되는 건 아님.
• 따라서 인터프리터는 스크립트의 실행을 시작할 뿐만 아니라 바이트코드를 컴파일러로 전달함. 즉 로드된 스크립트를 컴파일러로 전달함.

 

 

---

2-2. Compiler 단계

• 인터프리터가 스크립트를 실행하는 동안 컴파일러는 스크립트를 머신 코드로 컴파일하기 시작함.
• JIT 컴파일러는 코드를 읽고 실행 중에 컴파일링을 시작하고 동시에 컴파일 된 코드를 실행함.
  
  • 기존 스크립트나 스크립트의 일부가 다시 실행되는 경우 이미 컴파일링을 거쳤으므로 재컴파일될 필요가 없어서 해당 코드를 그대로 사용하므로 훨씬 더 빠른 방법이 됨. 
• 짧은 스크립트의 경우에는 인터프리터 작업 자체가 이미 끝난 뒤더라도 컴파일링 단계는 수행됨.
• 비교적 신속한 작업인 머신코드 컴파일링이 끝나면 해당 머신 코드는 컴퓨터로 전달되어서 실행 단계로 접어듦.
• 최상의 성능을 위해서는 단순히 코드를 실행하는 것이 아니라 머신에 코드를 컴파일한 다음 운영체제에 전달해야 함.
• 컴파일러 또한 브라우저의 Javascript 엔진에 포함된 기능으로 Google Chrome 브라우저의 v8 엔진 속 컴파일러는 TurboFan이라는 이름이 붙어 있음. 

 

 

---

 

3. API

 

 

• 브라우저는 API와 같이 Javascript 코드에서 사용할 수 있는 빌트인 기능을 지원함.
  • 사용자의 위치를 파악하는 등 여러 빌트인 API가 있음.
  • 이와 같은 브라우저 API는 브라우저의 일부로 C++로 쓰여 있는데 이 또한 어떤 브라우저를 사용하는지에 따라서 다름.
• 즉 브라우저는 의사소통의 다리가 되어줌.
• 함수나 객체를 호출할 수 있는데 Javascript 코드에서만 호출할 수 있는 사항들임.
• Javascript 코드에서 호출할 수 있다는 건 코드를 인터프리터와 컴파일을 거치면 브라우저가 해당 함수나 객체를 어디서 찾아야 하는지 알게 되고 이와 같은 API도 찾음. 네이티브 API 호출이나 빌트인 브라우저 기능 호출은 인터프리터 또는 컴파일된 코드에 포함됨.
• 이것으로 컴파일링 완료된 코드가 머신 상에서 실행되고 해당 브라우저의 API에 액세스 할 수 있게 됨.
• 액세스를 하든 액세스를 희망하든 해당 사항이 컴파일된 머신 코드에 포함된다는 뜻. 

 

 

 

 

 

참고: Udemy 자바스크립트 완벽 가이드, https://catch-me-java.tistory.com/11