JavaScript AST programming: Introduction and beyond

on YouTube ↗44m

" summary

Live coding builds a small CLI that reads a file or stdin, parses JavaScript with acorn into an ESTree-like AST (~400 node kinds mentioned), traverses nodes to detect patterns like console.log and problematic binary + conversions, performs edits (remove logs, replace unsafe plus with Number calls), and prints either transformed code or AST JSON streaming. The pipeline uses a parser, a traversal library and a generator and demonstrates the changes working end to end.

AI-written summary · about

" chapters (9)

1. 0:00Introduction to JavaScript AST
2. 12:27What is an Abstract Syntax Tree
3. 16:40Building a JavaScript parser
4. 24:08Exploring AST structure
5. 30:20Generating code from AST
6. 34:38Common AST manipulation patterns
7. 38:08Traversing the AST
8. 40:24Practical AST use cases
9. 43:16Q&A and closing

" related talks

• 43mJavaScript ❤ binary dataKirill Cherkashin · HolyJS 2018 Piter
• 22mHow Linters, Compilers & Other Cool Things WorkWill Klein · CascadiaJS 2018
• 31mAST à la Vista, BabyLeonardo Garcia Crespo · NodeConf Argentina 2017
• 47mComputer, refactor my code!Zbyszek Tenerowicz · GrillJS 2019
• 38mSource code manipulation (...)Iurii Chulovskyi · JDD 2019
• 28mMaster the art of the AST and take control of your JSYonatan Mevorach · Full Stack Fest 2017
• 29mMy Little Parser: Tooling is MagicChris Dickinson · CascadiaJS 2013
• 33mAs Simple as an ASTPavithra Kodmad · JSHeroes 2017