7 things you need to know about Flutter State Management

Flutter, Google’s UI toolkit for cross-platform development has gained so much attention lately. Along with the Flutter, state management is also getting popular in the Flutter community.

In this article, we will explore an overview of Flutter State Management.

1. What is the state?

When a user interacts with an application, some information needs to be changed and the UI needs to be rebuilt at that moment, that information, which is necessary to reflect changes is called the State of application at that moment.

2. What is State Management?

Whether you are building web applications or mobile applications, State Management is the key for managing application views.

State Management is the strategic approach to manage all the interactions that a user performs on an application and then reflect those changes to UI, update databases, server requests etc. Any application has many UI controls such as text fields, radio buttons, buttons, checkboxes, dropdowns etc. State management refers to handling the states of such UI controls as most of the time one or more UI controls are depending on one-another, based on business logic requirements.

Every development framework has its own unique way to efficiently perform state management. Like Flutter, many frameworks have more than one approach.

3. Why is State Management important?

State Management reflects the efficiency of the system and the care taken by developers to build that system so that every functionality and feature performs smoothly and precisely.

State management helps to align and integrate the core business logic inside the application with servers and databases. Without proper state management burden on users will increase and that would certainly decrease the effectiveness of an application.

As well as by centralizing everything with State management, it will be easier to maintain a code base and will in-turn improve the code-quality and readability.

4. Understand Flutter State Management

First and Foremost, Flutter follows a declarative programming structure.

Here, Flutter has a different approach to state management. Unlike other frameworks, Flutter tries to rebuild the UI from scratch to reflect the latest changes in the state.

Two Google developers from the Flutter development team, Filip Hráček, and Matt Sullivan have presented in a detailed way what pragmatic state management is in Google I/O 2019 conference.
https://youtu.be/d_m5csmrf7I

5. Think Declaratively

Most of the frameworks, right from the Win32 to web to Android SDK to iOS UI-kit, use an imperative style for UI programming. Most of you are familiar with that where you manually build UI forms and create various methods to reflect changes on that UI. But for Flutter, you must think declaratively as Flutter apps are declarative in nature. So, for Flutter everything is code whether it is UI building or business logic. Read More about Flutter Declarative Programing.

Apart from that declarative UI programming has many benefits like you have one code path to look for any state management. Also, whenever any state changes, it will trigger a redraw of the complete UI from scratch.

6. Conceptual Types of States

At any point in time of the flutter application lifecycle, your application will be in either of two below states :

a. Local / Ephemeral State

b. Shared / App state

Local State

Whenever you need to change the state of a single page view which may contain UI controls or animation then it is considered as a local state. You can easily do that using the Stateful widget.

Shared App State

Whenever you need to change the state of multiple widgets which are shared across your application then it is Share app State.

7. List of Flutter State Management Approaches/Techniques

1. Provider
2. setState
3. Inherited Widget & Inherited Model
4. Redux
5. FishRedux
6. Flutter Commands
7. GetIt
8. MobX
9. Riverpod
10. GetX

Conclusion

To conclude, this is all about Flutter State management that one should know. You can go ahead study various Flutter state management approaches and implement them in your application based on your requirement. In this article, I have tried to give a basic overview of Flutter State Management.

Thank you for reading.

Happy Coding. Keep Fluttering.

References:

Spec-India

Flutter Dev

Code with Andrea