provider

Provider Skill

This skill defines how to correctly use the provider package in Flutter applications.

---

1. Provider Types

Provider	Use for
Provider	Exposing any immutable value
ChangeNotifierProvider	Mutable state with ChangeNotifier
FutureProvider	Exposing a Future result
StreamProvider	Exposing a Stream
ProxyProvider / ChangeNotifierProxyProvider	Objects that depend on other providers

---

2. Setup

MultiProvider(
  providers: [
    Provider<Something>(create: (_) => Something()),
    ChangeNotifierProvider(create: (_) => MyNotifier()),
    FutureProvider<String>(create: (_) => fetchData(), initialData: ''),
  ],
  child: MyApp(),
)

• Use MultiProvider to group multiple providers and avoid deeply nested trees.
• ChangeNotifierProvider automatically disposes the model when it is no longer needed.
• Never create a provider's object from variables that can change over time — the object won't update when the variable changes. Use ProxyProvider instead.
• If you have 150+ providers, consider mounting them over time (e.g., during a splash screen) rather than all at once to avoid StackOverflowError.

---

3. Consuming State

Always specify the generic type for type safety:

// Listen and rebuild on change — only valid inside build() or a Provider's update method
final count = context.watch<MyModel>().count;

// Access without listening — use in callbacks, not inside build()
context.read<MyModel>().increment();

// Listen to only part of the state
final count = context.select<MyModel, int>((m) => m.count);

Use Consumer<T> or Selector<T, R> widgets when you need fine-grained rebuilds and cannot access a descendant BuildContext:

Consumer<MyModel>(
  builder: (context, model, child) => Text('${model.count}'),
  child: const ExpensiveWidget(), // rebuilt only once
)

Selector<MyModel, int>(
  selector: (_, model) => model.count,
  builder: (_, count, __) => Text('$count'),
)