Building a Time Machine with ES6 Proxies
summary
Live coding builds a single function that returns an ES6 Proxy wrapping the app state, pushing full structuredClone snapshots into an array and tracking a currentIndex. Runtime tools: getters/setters as traps, a small onUpdate callback for UI reactivity, and simple timeline management that can jump back 5 seconds or spawn new timelines. Demo shows the game rewind and branching working, with caveats: full-state memory cost and past actions not mutating future.
AI-written summary · about
chapters (8)
- 0:00JavaScript Proxies intro
- 3:05Proxy traps explained
- 5:11Proxy getters and setters
- 10:24Simple time machine
- 14:38Time travel with state history
- 21:26Time-travel game demo
- 26:01Timelines and advanced features
- 28:29Caveats and wrap-up
related talks
49mBuilding a Time Machine with ES6 Proxies
29mBuilding a Time Machine with ES6 Proxies
26mJavaScript Metaprogramming - ES6 Proxy Use and Abuse
37mTime Travel Debugging JavaScript Applications
24mJavaScript metaprogramming with ES2015 Proxy
52mJavaScript Metaprogramming - ES6 Proxy Use and Abuse
31mImmer, Immutability and the Wonderful World of Proxies
27mUnlock the Proxy Power (Vue.js)