Open source · Featured · 2023
LR(0) Parser Visualization Tool.
Parsing, made visible.
presentsAdmit one
Act I
The challenge
LR(0) parsing makes sense on a whiteboard and evaporates the moment you look away. I wanted to make it tangible: type any grammar and watch the item sets, the parse table, and the parser’s every move build in front of you.
Act II
What I built
Type a grammar and the whole LR(0) pipeline builds in the browser across six guided phases: the augmented grammar, item-set closure and goto, the canonical collection drawn as a pannable DFA, a colour-coded ACTION/GOTO table that flags conflicts instead of silently overwriting them, and a step-by-step parse trace. I rebuilt the engine as a framework-free set of pure functions (grammar, item sets, table, parse) covered by unit tests against a reference table, with the React UI just rendering their output.
Intermission, the demo
The product, playing itself
S → id + id · shift, shift, shift, reduce, the table decides every move
five moves of an LR(0) parse, stepping like the classroom tool does
The cast
What actually makes it work
Read the card, then flip it to watch the mechanism run.
0x01
Canonical-collection construction
A worklist closure/goto loop runs to a fixed point with structural set-equality dedup, so identical item sets collapse into one state.
how it works
Canonical-collection construction
0x02
ACTION / GOTO table with conflict flags
Reduce-state detection with explicit end-marker and accept handling. When two entries land in the same cell, the clash is flagged as a shift/reduce or reduce/reduce conflict instead of being overwritten.
how it works
ACTION / GOTO table with conflict flags
0x03
Table-driven parse simulation
Dual state and symbol stacks step through an input string with per-step snapshots and graceful, explained errors, so every shift and reduce is visible.
how it works