6 pontos por xguru 2020-04-06 | 2 comentários | Compartilhar no WhatsApp
  • Explica de forma fácil de entender as etapas de compilação do Svelte

#1 Ler o arquivo .svelte e convertê-lo em AST

→ O HTML é analisado pelo próprio parser, Script usa Acorn, CSS usa css-tree

#2 Percorrer a AST para rastrear referências e dependências

→ Criar uma instância de Component e marcar as variáveis encontradas

#3 Gerar blocos e fragmentos de código

→ Renderizador DOM/SSR

#4 Geração de código

2 comentários

 
heycalmdown 2020-04-07

Assim como o Toast UI Editor (https://pt.news.hada.io/topic?id=1823), apresentado há alguns dias, e o Language Server Protocol (https://en.wikipedia.org/wiki/Language_Server_Protocol), parece que está aumentando cada vez mais o número de projetos que utilizam AST. Acho que já vi antes a proposta de enviar arquivos JS não como texto, mas como AST, para que o motor do navegador os interpretasse mais rapidamente; não era exatamente este texto (https://blog.cloudflare.com/binary-ast), mas parece uma ideia parecida.

Quando, em vez de um AST gerado implicitamente, passamos a criar manualmente um AST com mais significado, isso acaba virando uma linguagem funcional da família de S-Expression. Seria interessante se os dois se encontrassem no meio do caminho.

 
xguru 2020-04-06

Depois de ler isso uma vez, provavelmente vai ficar mais fácil para colaboradores externos contribuírem com o código do Svelte.