앵귤러 콤파일러 저스트 인 타임 VS 어헤드 오브 타임

앵귤러에서 작성된 HTML과 Component (TypeScript), Declarative code, 는 JavaScript로 변환 (compilte)을 거쳐야만 브라우저에 시 인식이 가능합니다. 변환하는 시기에 따란 JIT와 AOT가 있는데요. 그 차이점을 알아보겠습니다.

---

JIT (Just In Time) Compiler

브라우저가 작동할 때 해당코드를 변환 (runtime compilation). 파일 별로 변환하는 방식이고 브라우저가 코드를 변환하기 위해 ㅇ앵귤러 콤파일러를 다운로드하기 때문에 속도가 느리고 용략이 커짐. 로컬 개발환경에 적합.

 

AOT (Ahead Of Time) Compiler

브라우저가 작동하기 전에 작성된 코드를 사전에 변환하는 방식 (build time compliation)으로 앵귤러 버전 9부터 기본 변환방식으로 채택됨

ng build --prod //프로덕션

ng server --aot //로컬에서 AOT 켜기

장점	설명
빠른속도	변환이 완료될 때까지 기다릴 필요가 없이 사전에 변환된 코드를 작동시키므로 rendering 속도가 빠름
비동기 요청 감소	자바스크립트 파일안에 템플릿 파일과 스타일 파일을 포함하여 해당 파일들에 대한 비동기 요청의 필요성 제거
작은 용량	사전에 변환이 완료되기 때문에 어플리케이션 용량의 절반 정도를 차지하는 앵귤러 콤파일러 다운로드가 불필요
에러 감소	템플릿 에러를 변환 과정에서 발견 할 수 있어 사용자가 이를 보기 전에 수정가능
안정성	브라우저가 소스코드에 접근하기 전에 변환이 이루어지기 때문에 Client-side 코드의 노출감소로 안정성 향상

작동원리

---

참고

Angular