Demystifying performance tune up in Flutter and Dart
summary
Walks through a real Flutter app that spikes a frame to 793 ms build by doing a recursive Fibonacci, stacking 100 opacity layers and an animated progress indicator so frames exceed the 16 ms frame budget. Uses DevTools flame chart and network tab to expose 10 unnecessary cocktail/meal API calls and recommends moving aggregation to a backend or using Future.wait. Shows profile-on-device measurements, bundle inspection with the analyze-size flag, and simple fixes: const widgets, prefer widgets over functions, and asset optimization.
AI-written summary · about
chapters (11)
- 0:00Flutter performance tuning intro
- 2:33Flutter performance issues
- 5:01Async in Dart myths
- 7:11Frame rendering 16ms rule
- 12:43Investigating performance issues
- 19:09Real-world performance case
- 25:10DevTools performance analysis
- 31:55Network and backend optimization
- 35:50Measuring and optimizing app size
- 41:51Preventative performance tips
- 47:51Final recommendations & Q&A
related talks
31mBuilding Consistently Fast Flutter Apps
38mDebugging performance issues with the Flutter DevTools
40mFluttering at 60 FPS
44mNo More Jank: How to Keep Your Flutter App Smooth and Snappy
46mFlutter: 60 Frames of AOT Badassery
01h 03mProfiling Flutter Apps: Undeservedly Forgotten Heroes
02mDebug and profile your app with Flutter DevTools
47mAnimations in Flutter