코드를 컴퓨터가 이해하기 쉬운 형태로 바꿔주는 역할을 하는 것을 컴파일이라 하고 이것을 처리하는 프로그램을 컴파일러라고 한다.
텍스트를 컴파일러 프로그램이 파싱하여 AST라는 자료구조로 변환한다.
컴파일러 프로그램이 AST를 바이트코드로 변환한다.
타입스크립트는 컴파일 단계에서 AST를 만들어 타입검사를 한 후 자바스크립트로 변환하는 과정을 거친다.
전체적인 타입스크립트 컴파일 과정은 위 사진과 같다.
여기서 1~3은 타입스크립트 컴파일러(tsc)에서 실행하고, 4~6은 실행 환경(브라우저, Node.js 등)에서 실행한다.
가장 큰 이유로는 SEO(Search Engine Optimization)
를 위한 SSR(Server Side Rendering)
을 가능하게 하기 때문이다.
React는 기본적으로 CSR(Client Side Rendering)
방식을 사용한다.
CSR
은 유저가 브라우저를 통해 웹에 접속하면 서버로부터 빈 HTML과 애플리케이션 로직이 담긴 JavaScript 파일을 로드한다. 모든 JavaScript가 로드될 때까지 기다려야 하므로 첫 로딩 시간이 길고 SEO
에 취약하다는 단점이 있다.
반면 SSR
은 pre-rendering
을 통해 페이지를 서버에서 미리 렌더링할 수 있어 JavaScript가 로드될 때까지 기다려야 할 필요가 없다. 따라서 사용자에게 빠르게 초기 페이지를 제공할 수 있는데 이는 SEO
에 유리하며, CSR
에 비해 초기 로딩 시간을 단축할 수 있다.