Flutter, is rx dart required for BLoC?

Question

In the bloclibrary official site documentations I have seen, I have never seen they used rx dart.

However, sometimes in the community, they saying it is much better to use rx dart together. But I don't understand. I'm using firestore as the backend and I just don't feel that I need rxdart at all. And even though I tried hard to search, I wasn`t able to see a good sample project using rx dart + BLoC.

What is good if you use rx dart with BLoC? Could I see a example?

Grip

Answer 1

You're mixing up the BLoC pattern, with the Bloc library.

The BLoC pattern is a reactive state management solution, created by Google. Its goal is to behave as a middleman between data in your app, for example, to handle state and business logic between an API and your UI.

It is meant to be platform-independent, meaning that the same dart code in the Bloc will work in frameworks like Flutter and Angular.

Typically, with RxDart, you create a BLoC like this:

class AppDataBloc {
  // The publish subject is responsible for get/add data and 
  // pass it to the UI as a stream.
  final _appDataSubject = PublishSubject<AppData>();

  // This is the stream the UI will use.
  Observable<AppData> get appData => _appDataSubject.stream;

}

The Bloc library, on the other hand, is an implementation of the BLoC pattern.

Not only does it provide a simple, unified, and intuitive way of implementing the BLoC pattern, but it makes your apps extremely easy to test and maintain.

So to answer your question, you DON'T need RxDart, unless you want to implement the BLoC pattern on your own. If you use the Bloc library, you're already using a RxDart free implementation of the BloC pattern.

Nerine

Answer 2

If you refer to the bloc package created by Felix Angelov you don't necessarily need to use rx_dart, but you could.

For instance you can apply some of the rx_dart operators, such as switchMap, where, debounce, throttle etc on the transformEvents and/or transformTransitions. In that way you can manipulate the events, which are coming to the bloc (for instance applying back pressure, which will avoid overloading the server with too many requests)

Bloc lifecycle

In case you want to take the full advantage of the reactive streams, you could explore the rx_bloc eco system, which is an implementation of the Business Logic Component pattern that embraces rx_dart.

Basically you need to declare the contracts of a particular feature, and then to implement the bloc, which is compliant with it in reactive manner. For instance if you need to fetch some news from an API you need to declare the contracts in this way:

/// A contract, containing all News BloC incoming events
abstract class NewsBlocEvents {
  /// Send a search event to the bloc with some payload
  void search({required String query});
}

/// A contract, containing all News BloC states
abstract class NewsBlocStates {
  /// The news found by the search query
  ///
  /// It can be controlled by executing [NewsBlocStates.search]
  ///
  Stream<Result<List<News>>> get news;
}

Now when all contracts are defined, you need to implement the Reactive BloC

/// A BloC responsible for the news
@RxBloc()
class NewsBloc extends $NewsBloc {
  /// The default constructor injecting a repository through DI
  NewsBloc(this._repository);
  
  /// The repository used for data source communication
  final NewsRepository _repository;

  /// Your events-to-sate business logic
  @override
  Stream<Result<List<News>>> _mapToNewsState() =>                 
      _$searchEvent
          /// Here you can apply any of the rx_dart operators
          /// for instance, you can apply back pressure
          .debounceTime(Duration(seconds: 1))
          /// Then you get the data from the repository
          .switchMap((_) => 
              _repository.decrement().asResultStream(),
          );
}

Once you have your business logic implemented, you can access the bloc within a widget tree by using flutter_rx_bloc. There are plenty of articles and examples, where you can learn how to use this eco system.

Celom

This is inaccurate. The block package from Felix depends on rxdart. You might not use the operators yourself, but the package uses rx anyway. Felix was asked if it was possible to decouple this dependency, but he basically said it's not a priority (ie, it will never be done). – Piggyback

It seems that RxDart was removed as a dependency from version 4.0.0 - github.com/felangel/bloc/blob/master/packages/bloc/CHANGELOG.md – Grettagreuze