Cursors Illustrated: Collaborative sketching

on YouTube ↗25m

" summary

Claims that cursors from OM make immutable state practical in JavaScript and that pairing immutability with React.js cuts wasted renders, with a concrete example showing 10,000-item lists causing 10,000 renders versus one real DOM change. Demonstrates code patterns (concat vs push), builds a small to‑do app wiring cursors with a callback, and shows replayable application state so the approach actually reduces renders and makes one‑way data flow tractable.

AI-written summary · about

" chapters (10)

1. 0:00Thinking through sketching
2. 2:19Functions as black boxes
3. 3:40The evolution of web apps
4. 5:21React and component architecture
5. 7:55Performance and virtual DOM
6. 11:05Immutability and references
7. 14:06Immutable operations
8. 16:12One-way data flow
9. 19:22Cursors for data management
10. 22:08Conclusion and collaboration

" related talks

• 34mA Cartoon Guide To Performance in ReactLin Clark · Web Unleashed 2016
• 30mA Cartoon Guide to Performance in ReactLin Clark · Nordic.js 2016
• 32mRefracting ReactDavid Nolen · React.js Conf 2015
• 36mCreative Coding with React & SVGVarun Vachhar · FITC Toronto 2016
• 34mFunctional UIs and Unidirectional DataflowMikael Brevik · JSConf Budapest 2015
• 29mEvolving the Visual Programming Environment with ReactJonas Gebhardt · ReactEurope 2016
• 30mD3 and React, TogetherShirley Wu · ReactiveConf 2017
• 31mUnderstanding Rendering PatternsAtila Fassina · revo.js 2023