Riverpod trigger rebuild when update state with freezed copywith even if nothing changed

Question

I thought Riverpod will only trigger rebuild if the state value is different but turn out it rebuild every time when state is set although the value is the same. Is that true?

The case is as below

@Freezed(genericArgumentFactories: true)
class Model with _$Model {
  const factory Model({required int id}) = _Model;
}

class Manager {
  static StateProvider<Model> modelProvider =
      StateProvider<Model>((ref) => Model(id: 1));
  Manager() {
    Stream.periodic(Duration(seconds: 1)).take(1000).listen((event) {
      ref.read(modelProvider.notifier).update((state) {
        var cloneState = state.copyWith();
        print("${state == cloneState}"); //This print true
        return cloneState;
      });
    });
  }
}

class TestWidget extends ConsumerWidget {
  const TestWidget();

  @override
  Widget build(BuildContext context, WidgetRef ref) {
    var model = ref.watch(Manager.modelProvider);
    print("model change......................"); //print every second
    return Text(model.id.toString());
  }
}

It showed that the TestWidget was rebuilt every seconds but I thought it shouldn't as the state is the same although I set it again. Am I missing something? Thanks.

score 2 · Answer 1 · answered Jan 05 '23 at 10:47

2

Riverpod by default doesn't rely on == but identical to filter updates.
The reasoning is that == can be quite inefficient if your model becomes large.

But this causes the behavior you described: If two objects have the same content but use a different instance, listeners will be notified.
It's not considered a problem though, as there is no value in doing:

state = state.copyWith();

answered Jan 05 '23 at 10:47

Rémi Rousselet

256,336
79
519
432

Thanks. The key is `identical` but what I thought is `==`. – Anson Wong Jan 05 '23 at 12:11
Is there any ways for us to override the identical function? – Anson Wong Jan 05 '23 at 12:13
1

Not with StateProvider. StateNotifierProvider has updateShouldNotify – Rémi Rousselet Jan 05 '23 at 12:27
1

As well as AsyncNotifier and Notifier, which again use identical by default, but can be overridden with updateShouldNotify, and can also use notifyListeners as an alternate trigger. – Randal Schwartz Jan 05 '23 at 20:13

score 1 · Accepted Answer · answered Jan 05 '23 at 09:09

It's all about using identical(old, current) under the hood to compare states. identical presents for itself the following:

/// Check whether two references are to the same object.
///
/// Example:
/// ```dart
/// var o = new Object();
/// var isIdentical = identical(o, new Object()); // false, different objects.
/// isIdentical = identical(o, o); // true, same object
/// isIdentical = identical(const Object(), const Object()); // true, const canonicalizes
/// isIdentical = identical([1], [1]); // false
/// isIdentical = identical(const [1], const [1]); // true
/// isIdentical = identical(const [1], const [2]); // false
/// isIdentical = identical(2, 1 + 1); // true, integers canonicalizes
/// ```
external bool identical(Object? a, Object? b);

Here is a complete copy-run example:

void main() => runApp(const ProviderScope(child: MyApp()));

@Freezed(genericArgumentFactories: true)
class Model with _$Model {
  const factory Model({required int id}) = _Model;
}

class Manager {
  static StateProvider<Model> modelProvider = StateProvider<Model>((ref) {
    Stream.periodic(const Duration(seconds: 1)).take(1000).listen((event) {
      ref.read(modelProvider.notifier).update((state) {
        final cloneState = state.copyWith();
        // const cloneState = Model(id: 1); //The print true in both cases
        print("${state == cloneState}"); //This print true
        print("identical: ${identical(state, cloneState)}"); //This print false
        return cloneState;
      });
    });

    return const Model(id: 1);
  });
}

class MyApp extends ConsumerWidget {
  const MyApp();

  @override
  Widget build(BuildContext context, WidgetRef ref) {
    var model = ref.watch(Manager.modelProvider);
    print("model change......................"); //print every second
    return MaterialApp(home: Text(model.id.toString()));
  }
}

I modified the example a little, but kept the essence the same. Only by applying `const' can we achieve the absence of rebuilds.

This will not be correct, but you can apply the trick and determine for yourself when you need to update the state. Something like `if (state != cloneState) ` then update the state, otherwise do nothing. — Ruble, Jan 05 '23 at 11:08
Thanks for your help. May I know what you mean of `Only by applying `const' `? Where should I apply const. — Anson Wong, Jan 05 '23 at 12:10
For example, by creating such objects: `const Model(id: 1);` — Ruble, Jan 05 '23 at 15:23

Riverpod trigger rebuild when update state with freezed copywith even if nothing changed

2 Answers2