Jetpack Compose: Drawing without pain and recomposition
summary
Jetpack Compose performance improves by deferring state reads out of composition into measurement or drawing so rapid animations don’t trigger full recomposition; replacing alpha modifier with graphicsLayer or reading animated DP inside a custom layout/measure block eliminates per-frame recomposes, and switching animateColorState consumption into a draw lambda avoids repeated composition. Memory fixes include caching brushes and using canvas.translate to stop creating thousands of LinearGradient objects, and reusing FloatArray/native canvas drawPoints instead of boxed Offset lists to avoid ~779k allocations during particle animations. defer reads to measurement/draw phases cache brushes and translate canvas use native float arrays for drawPoints
AI-written summary · about
chapters (16)
- 0:00Jetpack Compose optimizations
- 3:15Compose phases
- 5:04Recomposition triggers
- 6:29Alpha animations with GraphicsLayer
- 8:41State reads in phases
- 11:59Defer state reads
- 14:05Height animation measurement
- 17:41Background color animation
- 21:12Phase changes for performance
- 22:39Lottie animations and recomposition
- 25:08Icon recomposition in top bars
- 28:27When to optimize recomposition
- 28:51Memory with shimmer effects
- 32:23Particle systems memory
- 35:39Optimizing drawPoints
- 38:26Summary & Q&A
related talks
36mJetpack Compose: Drawing without pain and recomposition
36mDrawing without pain and recomposition
38mJetPack Compose Performance Tips & Tricks
24mJetpack Compose Performance Improvements Learned from Real Examples
21mPerformance best practices for Jetpack Compose
37mPerformance in Compose:Lessons learned from Lazy layouts
21mAnimations with Jetpack Compose
21mMore performance tips for Jetpack Compose