Simplifying Complex UIs with Finite Automata & Statecharts
summary
A declarative library called xstate models finite state machines and Harel statecharts and yields a live visualizer of every state, transition and missing edge. It powers a refactor of Live Share signin, adds telemetry showing user flows, prevents race conditions, and lets CI generate integration paths via shortest‑path and depth‑first searches. Example gallery demo resists deliberate breaking. Claims include NASA using statecharts for a Mars rover and a Microsoft scale cited as ~50,000 engineers and ~1.5 billion customers.
AI-written summary · about
chapters (6)
- 0:00Start
- 0:55#Frameworkless
- 2:38What is the "music notation" of user interfaces?
- 7:19The bottom-up approach
- 9:42Finite state machines and statecharts
- 28:49Advantages of using statecharts
related talks
01h 01mThe visual future of reactive applications with statecharts
37mReactive State Machines and Statecharts
45mState of the Art User Interfaces with State Machines
38mState of the Art Web User Interfaces with State Machines
19mIntroducing state machines and statecharts
28mState machines for frontend state management
28msetState Machine
40mCoding Complex App Logic, Visually