Comprehensive Guidance for State Management In Flutter

Flutter Knowledge Sharing #43

Geno Tech
App Dev Community
5 min readAug 29, 2021

--

Image: State Management In Flutter

Flutter is the most engaging development Framework among developers because of so many reasons. In my medium account, I have shared my Flutter knowledge in 40+ articles, and this is another. Flutter applications are built as a widget tree. Widgets are the primary building block in Flutter. It makes your UI more beautiful and easy to implement. State Management is also very important similar to widgets in Flutter. We must have a piece of excellent knowledge in State Management. This article will give you a quick understanding of that.

What is a State?

In our application, I mentioned that it is built with widgets. App functions need to communicate or send data through these widgets. You have to do many data operations within these widgets. Whenever you need to rebuild your UI at any particular time by using whatever data, that particular moment is called a state.
Let us think of an example of a simple MCQ app.

  1. The first user needs to register to the app. Then rest of the pages need to update with this is a registered user.
  2. After logging in to the application, We need to show the relevant MCQ papers for the user based on registered details.
  3. When answering the paper, you need to calculate the time, correct/ wrong answers, no questions, etc.
  4. After the user has done the paper, scores and the rank should update.

In every state, we need to update our UI with data. Therefore the state management should be easy and clear to develop. Otherwise, all the things will mess up when increasing the complexity of the application.

Why is State Management so Important?

Before we talk about why this is a big topic in Flutter?, You should know state management and the purpose. Flutter has its state management process called setState() for setting the state of a UI. But in more complex situations, we need to work with combinations of states and show the different possibilities of states to users. At that time, we need to know how we manage these states in our applications, and this is why state management is so important.

What are the More Reasons?

We should have to handle well the information that is bound with the state. A state has different objects, variables, garbages, etc., to manage. Thus information complexity is a problem that we are going to address here.

It isn’t easy to obtain, so how do you find out where is the state changed from where. What are the different boundaries? Where do you get more information about your state? All of these things are unclear before understanding the state management process.

Another good point is the unclear structure of the application. That means the state is sometimes just a collection of variables in a class or something else, which will confuse your development.

History is brutal to track, so if you want to jump back in different as time stamps of your state, you will get some issues, which leads to problems that we have to solve in the long run.

What are the usual trade-offs?

You have to be aware of some disadvantages or be careful about these points. First, you need to invest more time in resources about state management principles. You have more concepts to follow because if you invest in a specific architecture strategy, you get more boundaries and more rules that you have to follow. Also, you have to explain to new team members, and you should make it very concise that you stay all over your application the same way and the same behavior.
you will have more boilerplates on your state management behavior.
If you don’t care so much about state management, you will solve your problems faster in the beginning. but in the long run, the long-term productivity could lead to some issues.

State Management in Flutter

Flutter is declarative, it means Flutter already has a approach to manage states. So we can work with that. It is the setState() pattern and the way most of you will understand and know already. There we have Stateful and Stateless widgets. In a stateful widget, we have a state that we track, and that state can be mutable. The state can change over time, and then we have to call setState(). That is the way how state management works and what Flutter has provided us already.
Apart from that, we can see many other state management techniques. Some of them I briefly introduced in the following article,

Redux package comes directly from the react Redux package to flutter and contains the same core principles. But in my article, I did not include redux. Redux is considered the most powerful approach for state management if Flutter; therefore, I will talk in detail.

How Pick the Best?

This is the ultimate problem we have to select the best pattern. I should use This problem is the ultimate problem; we have to select the best pattern. You should use the best one that solves your situation, and it highly depends on your success.
If you are a beginner developer in Flutter, I highly encourage you; the setState() is good enough, and you will take a long time till you come to the first problem. Where you want to lift the state up, where you come into problems, where you have to change all, I recommend you learn one of the packages I introduced you.
Suppose you’re already an experienced developer who already knows about web development or any other state management tools; for example, you come from a Redux background. In that case, I highly encourage you to take the Redux package because it already contains the core principles that you need to know. And you can introduce that to your team easier. Or else you can get the advice of experts, or you can research and select on your knowledge.

Happy Coding !!!

Found this post helpful? Kindly tap the 👏 button below! :)

--

--

Geno Tech
App Dev Community

Software Development | Data Science | AI — We write rich & meaningful content on development, technology, digital transformation & life lessons.