Conquering RenderSliver: Harnessing Power, Overcoming Fear
summary
Explains how RenderSliver turns scrolling into a constraints→geometry contract so viewport anchor, offset and direction decide what to paint, layout and hit test; default 250px cache matters for smoothness; shows how sliver geometry fields (paintExtent, layoutExtent, scrollExtent, hitTestExtent) drive behavior; demonstrates a Flutter-based product DJ that makes Sliver UIs server-driven so UI/UX/navigation ship without releases and a live demo pushes sticky app bars and lists to a device successfully; practical pattern: use Stack for pull‑to‑refresh Z ordering.
AI-written summary · about
chapters (11)
- 0:00Intro to RenderSliver journey
- 2:29Why fear RenderSliver
- 6:41How Flutter renders UI
- 10:13Viewport role explained
- 15:12What are Slivers
- 16:37Deep dive RenderSlivers
- 26:24Constraints and Geometry
- 31:48RenderBox vs RenderSliver
- 33:57Server-driven with DJ
- 37:10Live demo server-driven UI
- 39:02Key takeaways
related talks
01h 03mThat's how we scroll in Flutter
55mSliver in Flutter, or How Scrolling Works
26mMastering Custom Slivers in Flutter
24mThe Sacred Scrolls: Crafting Your Own Slivers
38mBuilding scrolling experiences in Flutter
25mA visual guide of rendering performance
30mMaking your app fast with high-performance components
27mSmooth Moves: Rendering at the Speed of Right ®