Responsive Svelte (exploring Svelte's reactivity)
summary
Explores Svelte reactivity by instrumenting components with console probes and a reflective counter writable store to count snippet executions, and by using two Repls (demo and reactive triggers). Finds HTML snippets re-execute often because Svelte tracks object dependencies at the object identity level, not per-property, and shows primitive normalization and moving logic into code snippets reduces needless executions. Dives into compiled JS, sets breakpoints to confirm set_data only updates the DOM when output changes, and supplies an extra-credit solution that counts reflexive vs re-render events.
AI-written summary · about
chapters (20)
- 0:00Start
- 0:31Introduction: Responsive Svelte (exploring Svelte's reactivity)
- 2:39Svelte Reactivity: The GreetUser Component
- 4:48Terminology SideBar: Snippets (code-snippets, html-snippets)
- 5:42Why Svelte is soo KOOL!
- 8:04Show Me: Exploring Reactivity
- 8:461. Diagnostic Logging Probes
- 10:572. Advanced Diagnostics
- 13:30Re-Render Analysis - Unexpected Results!
- 14:12Svelte's Dependency Monitoring
- 16:46Revisit Re-Render Analysis - Is Svelte Efficient?
- 17:15App-Based Reactivity Tweaks
- 17:471. Finer Grained Dependency Management
- 19:182. Preresolve Variations
- 20:25Svelte's Re-Render Optimization
- 24:33Are App-Based Reactivity Tweaks Necessary?
- 25:28Extra Credit Exercise
- 27:54What have we learned?
- 28:30Thanks Core Team & Big Bird?
- 29:10That's ALL Folks
related talks
24mSvelte: the last framework we need?
12mReactive programming. Svelte way
38mBuild your own Svelte 5
01h 14mSvelteJS Under the Hood
36mSvelte - Web App Development Reimagined
06mThat Svelte Magic (and why you should try it)
40mSvelte, cybernetically enhanced web apps
02h 57mSvelte Cookbook: A Masterclass on SvelteJS