AST: the Secret Weapon to Transform a Codebase

on YouTube ↗29m

" summary

Abstract Syntax Tree (AST) is the concrete technique that lets a codebase get bulk-upgraded: regex fails on multiline calls but code mod reliably converts thousands of sites in days, e.g. converting Ember curly to angle-bracket templates. Parsers like Babel and tools such as AST Explorer produce tokenized trees, transformation uses visitor hooks, and generation prints edits. A custom linter rule enforces conventions early, shortening review cycles and actually reducing manual fixes across the repo.

AI-written summary · about

" chapters (15)

1. 0:00Start
2. 3:22Observations
3. 7:12Linter
4. 8:50Edit Syntax
5. 10:46Third Tool Transpiler
6. 16:44Abstract Syntax Tree
7. 17:25The Abstract Syntax Tree
8. 19:52Parsing Process
9. 20:52Real World Code Example
10. 22:31Columnar Parser
11. 23:59The Transformation Step
12. 24:57Visitor Hook Pattern
13. 27:07Code Generation Step
14. 28:33Resources
15. 28:54Contact Information

" related talks

• 31mAST à la Vista, BabyLeonardo Garcia Crespo · NodeConf Argentina 2017
• 33mAs Simple as an ASTPavithra Kodmad · JSHeroes 2017
• 43mMachine Powered Refactoring: Leverage AST's to Push Your Legacy Code (& the Web) ForwardAmal Hussein · Node+JS Interactive 2018
• 29mMy Little Parser: Tooling is MagicChris Dickinson · CascadiaJS 2013
• 20mThey see me refactorin'. They hatin'Vit Gottwald · ReactiveConf 2018
• 38mThe magical land of AST's with babel, eslint and codemodsVivek Nayyar · ReactFoo 2019
• 34mCodemods and Transforming JavaScript CodeMikhail Hatsilau · The Rolling Scopes Conference 2018
• 31mThe Different Transformation Stages of AOT CompilersEytan Manor · JSConf.Asia 2019