Large Flutter apps need predictable state architecture. BLoC, Riverpod, and MobX each offer different trade-offs.

BLoC Pattern

  class CounterBloc extends Bloc<CounterEvent, int> {
  CounterBloc() : super(0) {
    on<Increment>((event, emit) => emit(state + 1));
  }
}

BlocBuilder<CounterBloc, int>(
  builder: (context, count) => Text('$count'),
)
  

Riverpod AsyncValue

  final userProvider = FutureProvider<User>((ref) async {
  return api.fetchUser();
});

ref.watch(userProvider).when(
  data: (user) => Text(user.name),
  loading: () => CircularProgressIndicator(),
  error: (e, _) => Text('Error: $e'),
);
  

Freezed Models

  @freezed
class User with _$User {
  const factory User({required String name, required int age}) = _User;
}
// Immutable with copyWith, ==, hashCode generated
  

Repository Pattern

Separate data sources from business logic. Inject repositories via providers.

Testing State

Test BLoCs with bloc_test. Test Riverpod providers with ProviderContainer.

Common Pitfalls

  • Ignoring null safety warnings and using ! operator carelessly.
  • Calling setState excessively causing unnecessary rebuilds.
  • Mixing async patterns without proper error handling.
  • Hardcoding values that should be theme constants.

Best Practices

  • Prefer const constructors for static widgets.
  • Use named parameters for widget constructors.
  • Extract reusable widgets into separate files.
  • Write widget tests for critical UI paths.

Memory and Performance Notes

BLoC adds boilerplate but scales well for complex event-driven flows.

Exercise

Refactor a setState app to use Riverpod with AsyncNotifier for API data fetching.

Hint: Use ref.invalidate(provider) to force refresh.

Summary

Practice with Flutter DevTools open to observe rebuilds and performance.

Debugging Checklist

  1. Read the full error in the console.
  2. Use Flutter DevTools widget inspector.
  3. Hot restart vs hot reload — know the difference.
  4. Check null safety and type errors first.
  5. Simplify widget tree to isolate the issue.

Real-World Application

Production Flutter apps combine these patterns with analytics, crash reporting, and CI/CD.

Further Reading

Flutter documentation, Dart language tour, and pub.dev packages.

Additional Examples

Consider how this topic applies in a larger project:

  // Break the problem into smaller functions
// Test each function independently
// Integrate incrementally
  

Working through variations of the examples above builds deeper understanding than reading alone.

Interview and Review Questions

  1. Explain the core concept of this topic in your own words.
  2. What happens when this code runs with edge-case input (empty, null, zero, max value)?
  3. How would you debug a bug related to this topic in production?
  4. What are the performance implications of the approach shown here?
  5. How does this feature compare to the equivalent in another language you know?

Review adjacent pages in the learning path before and after this one. Concepts build on each other — skipping ahead often leads to confusion when later pages assume mastery of earlier material.

Return to the section index if you need to fill gaps in prerequisite knowledge.

Tooling Tips

  • Enable all compiler or analyzer warnings during development.
  • Use version control with small, focused commits for each exercise.
  • Pair reading with typing — reproduce every code example by hand.
  • Run tests or compile after every change to catch errors early.
  • Keep a personal notes file linking concepts to your own project experiences.

Additional Examples

Consider how this topic applies in a larger project:

  // Break the problem into smaller functions
// Test each function independently
// Integrate incrementally
  

Working through variations of the examples above builds deeper understanding than reading alone.