Loading source
Pulling the file list, source metadata, and syntax-aware rendering for this listing.
Source from repo
Build cross-platform Flutter 3 apps with Riverpod/Bloc state management, GoRouter navigation, and performance optimization.
Files
Skill
Size
Entrypoint
Format
Open file
Syntax-highlighted preview of this file as included in the skill package.
references/performance.md
1# Performance Optimization23## Profiling Commands45```bash6# Run in profile mode7flutter run --profile89# Analyze performance10flutter analyze1112# DevTools13flutter pub global activate devtools14flutter pub global run devtools15```1617## Common Optimizations1819### Const Widgets20```dart21// ❌ Rebuilds every time22Widget build(BuildContext context) {23return Container(24padding: EdgeInsets.all(16), // Creates new object25child: Text('Hello'),26);27}2829// ✅ Const prevents rebuilds30Widget build(BuildContext context) {31return Container(32padding: const EdgeInsets.all(16),33child: const Text('Hello'),34);35}36```3738### Selective Provider Watching39```dart40// ❌ Rebuilds on any user change41final user = ref.watch(userProvider);42return Text(user.name);4344// ✅ Only rebuilds when name changes45final name = ref.watch(userProvider.select((u) => u.name));46return Text(name);47```4849### RepaintBoundary50```dart51// Isolate expensive widgets52RepaintBoundary(53child: ComplexAnimatedWidget(),54)55```5657### Image Optimization58```dart59// Use cached_network_image60CachedNetworkImage(61imageUrl: url,62placeholder: (_, __) => const CircularProgressIndicator(),63errorWidget: (_, __, ___) => const Icon(Icons.error),64)6566// Resize images67Image.network(68url,69cacheWidth: 200, // Resize in memory70cacheHeight: 200,71)72```7374### Compute for Heavy Operations75```dart76// ❌ Blocks UI thread77final result = heavyComputation(data);7879// ✅ Runs in isolate80final result = await compute(heavyComputation, data);81```8283## Performance Checklist8485| Check | Solution |86|-------|----------|87| Unnecessary rebuilds | Add `const`, use `select()` |88| Large lists | Use `ListView.builder` |89| Image loading | Use `cached_network_image` |90| Heavy computation | Use `compute()` |91| Jank in animations | Use `RepaintBoundary` |92| Memory leaks | Dispose controllers |9394## DevTools Metrics9596- **Frame rendering time**: < 16ms for 60fps97- **Widget rebuilds**: Minimize unnecessary rebuilds98- **Memory usage**: Watch for leaks99- **CPU profiler**: Identify bottlenecks100