Flutter. How to upgrade your BLoC

There are many libraries that implement the BLoC pattern. But the one I'm going to talk about is unusual and is called isolate_bloc.



As the name implies, this is some kind of unusual block, and its peculiarity is that it works in a separate Isolate (hereinafter isolate) and does not slow down your UI.



What is the problem with regular bloc?



In addition to the boilerplate, there is one more problem - it works in the main thread, so heavy tasks such as parsing json can lead to freezes in the UI.



Libraries like simple_bloc or cubit can help with the first problem. From the second - isolate, or a wrapper over it - Compute. In principle, this is a really good combination that many people use, but even it does not solve all problems. For example, you cannot work with MethodChannel in isolate, and, in principle, its use is associated with inconveniences and a boiler plate.



Isolate bloc







This library helps to use the BLoC pattern and solves a number of tasks, such as working with isolates and MessageChannels. In addition, it allows you to reduce the amount of code when writing the block itself.



How to use it?



To understand how to work with this library, let's look at a simple example.



Despite the fact that further I tried to describe everything in detail, something may remain incomprehensible, so it is assumed that you are already familiar with the BLoC pattern.



Any flutter project starts with a counter, so we'll start with that too. The first step is to write the block itself.







In line 3, we create a CounterBloc class that inherits from the IsolateBloc class. Here we indicate the type of events and states of our block.



On line 4, we pass the initial state of the counter - 0.



From lines 6 to 9, we override the onEventReceived method, which is called when a new event is received. State is a getter that returns the last state that the block sent to the UI.



In line 8, we use the emit function, which takes state and sends it to the UI.



Now you need to register the block.



Since it works in a separate isolate, we cannot directly create it. Therefore, you need to let the library know about its existence using the register function.







In line 5, we initialize the library and pass a function that will run in isolate and register blocks.



On line 10, we register CounterBloc - now the library will be able to create it at our request.



It remains only to describe the UI!







On line 8, we create a block and add it to the widget tree.



On line 23, we listen to the state of the block. IsolateBlocBuilder works like StreamBuilder, but is able to find the block in the widget tree itself.



From lines 31 to 33, we use the extension method isolateBloc <Bloc, State> () to get the block from the context and use the add () function to add a new event to it.



That's all, now you can start!



The final



Using a basic example, I showed how to work with this library, and for further study I advise you to look at its page on the github . All functionality is described there and there are more complex examples.



All Articles