Svelte 컴파일러 핸드북
(lihautan.com)- Svelte의 컴파일 단계를 이해하기 쉽게 설명
#1 .svelte 파일을 읽어서 AST로 변환
ㅤ→ HTML은 자체 파싱, Script는 Acorn, CSS 는 css-tree 사용
#2 AST를 탐색해서 레퍼런스와 의존성 추적
ㅤ→ Component 인스턴스 만들고, 변수들을 찾아서 마킹
#3 코드 블록 과 조각들 생성
ㅤ→ DOM/SSR Renderer
#4 코드 생성
며칠 전에 소개된 Toast UI Editor(https://news.hada.io/topic?id=1823)도 그렇고, Language Server Protocol(https://en.wikipedia.org/wiki/Language_Server_Protocol)도 그렇고 AST를 활용하는 프로젝트가 점점 많아지네요. 예전에 JS 파일을 텍스트가 아닌 AST로 내려보내서 브라우저 엔진이 더 빨리 해석하게 하자는 주장도 봤던거 같은데, 이 글(https://blog.cloudflare.com/binary-ast)은 아니었지만 비슷한 아이디어 같습니다.
암시적으로 만들어지는 AST가 아니라 좀 더 의미있게 손으로 AST를 만들게 되면 이제 S-Expression 계열의 함수형 언어가 되는데요, 중간에서 만나면 재밌겠네요.