Pragmatic State Management in Flutter (Google I/O'19)
Vložit
- čas přidán 27. 07. 2024
- Declarative UI frameworks eliminate whole classes of bugs. But they can also be a puzzle until you figure out how to structure your app logic around them. Walk through Flutter's app with live data and see how to structure content in a simple yet scalable way. You'll come out understanding the main approaches of state management in declarative frameworks and have a concrete applicable solution.
Watch more #io19 here:
Flutter at Google I/O 2019 Playlist → goo.gle/2ZTbnOs
Google I/O 2019 All Sessions Playlist → goo.gle/io19allsessions
Learn more on the I/O Website → google.com/io
Subscribe to the Flutter Channel → goo.gle/Flutter
Get started at → flutter.dev/
Speaker(s): Filip Hracek and Matt Sullivan
T0CEDC event: Google I/O 2019; re_ty: Publish;
I'm so happy that you guys decide to keep talking about state at these conferences.
Believe it or not this video was my first interaction with flutter when I began my journey in May 2020. It was unbelievably complex but I'm glad I dint give up. I've been a fan of Filip ever since.
19:40 I just love how the attitude given towards community packages 😊
By far the best flutter talk i have seen.
funny, weigh's alternative methodologies and very educative.
Love their style of delivery, makes the video very enjoyable along with being informative
Great talk. As someone who is very used to MVC from iOS I was confused where to start with flutter. This is a great way to start.
Don't be sad Matt. I wear the same pajamas while watching you last year.
so funny ...
Güzel espri reis Cem Yılmaz la bi akrabalık var mıydı?
Funny you guy
One of the best talks. Fun, technical, and cool
I've been suffering for days trying to implement a feature in a personal project and I just finished implementing the hardest part of it thanks to this talk and the Provider implementation. Life is good. Thank you, guys!
Hello am John from Uganda East Africa. I have an app idea but i couldn't afford to pay engineers for building it so I started learning programming. But I can't figer out how to store and use the input data form user please help me how do I do it.
@@johnmw170 have you figured it out how to store user data? I would like to know how to
@@elisiosa3111 if you need to store data locally on user's device, think about shared_preferences package or some databases (see sqflite package for example)
More than a year working with flutter and dart, from those early days to these Glorious times i just saw one thing and that was the absolute art.
Thinking about development teams and their unbelievable talent and work is mind blowing...
I believe we shouldn’t call them programmers or developers, in fact they are artists. I think we need to change our perspective of what the art is.
This provider sound much easier than bloc. Would love to see more detailed tutorials.
i watched this piece and really love it.. the delivery and explanation of the concept was top notch. this will definately help and aid my journey of becoming a flutter developer. thank you google
Currently at 14:00 and crying into my cornflakes as just finally got to grips with Bloc pattern and now a new reccomended approach.
If you like Bloc, stay with it!
I believe the point is if you have trouble with Bloc, they recommend Provider and you can migrate to Bloc as you need.
They literally said that bloc was perfectly fine and that they use it themselves. I think this was geared towards users who havnt made a choice yet and are confused by all the options and just want to be told 'use this'.
The final conclusion of this talk was if you feel comfortable with BLoC or Redux there's nothing wrong in using them, there's no golden bullet for Flutter apps architectures.
Can feel ya bud.. But I feel that BLoC will still be preferred for more complicated stuff.
Great , clears a lot of ambiguity when choosing a state management
I feel lucky watching this video as I am two weeks into Flutter!
Good job, Filip and Matt. You guys came to rescue when I was struggling with stateManagement in Flutter to get hold on it. Now its crystal clear and I know which pattern to go with and when. Choice is mine. Thanks a lot to both of you...🙏
@Matt: Viewer would like to see you in new shirt in upcoming conference.... 😄
Glad to hear this is helping you on your Flutter journey 🚂
Happy Fluttering 😎
It totally sounded like a Redux talk. Great to see Google's state management techniques transforming.
Hope you Google will continue these technolgoies you are putting out, i am so amazed by Go, Dart, Flutter
I am that much new to Flutter states that even, I found 6:57 really inspiring, and in fact I needed something like this for my recent projects lol
Thanks for the video, it was really fun and informative :)
"Thank you very much";
"Great tutorial";
"You're the best", and it goes on and on...
Give honest feedback already!
This is not personal and this applies to most content creators who teach flutter even Google's Flutter official channel, almost everyone is explaining things based on the assumption that the viewer comes from an app development background or that they already have been working with this "standalone" technology which is not so standalone if I had to get acquainted with other languages and frameworks to be able to understand its basics, people who started from scratch (to whom these crash courses should be addressed) are not accounted for whatsoever.
This creates an entry barrier, this prevents the app/web dev communities to prosper and become richer, there may be people who could have had an influence on the current practices if they were taken into consideration.
Again, this is not personal, I'm merely describing reality.
Awesome Provider! I might need this in my last project!
1:00 Story of my (work-) life. i just love these guys!
The best Flutter duo
Flutter Devs: What you need in state management?
Me: yes!
You are doing a great job over there! thank you
WOW! I am new to flutter and this video solved my problems!
One of the best tech reviewing videos i have ever seen. ❤
Thank you so much for the kind feedback, Heshan! We're so glad to hear you enjoyed this 😎
I just read a chapter "Duplicate Observed Data" in the book "Refactoring" from 1999. As I understood this approach, it is super similar.
Great video! This was amazing.
Good video for how to use and link stateful widgets. Thanks a lot!
These guys are awesome! The best on team flutter
14:22 this sentences sound so good!!
This is very good stuff! Thanks for sharing.
I loved the way to presented, Great work
Thanks for making this scary topic fun and entertaining. I almost forgot you guys were actually trying to teach :) - Look forward to seeing you guys again next year!
These guys share a great rapport
Excelent speech, flutter is awesome!
Love the small parts of humor!
Great talk. Helped me a lot.......
new to flutter here, so this means you can create your whole app with providers and static widgets turning stateful widgets useless unless minor local state management?
The whole video I was not sure if the fly is real or in the video... btw really nice info. I am starting to love Flutter
Great and pragmatic video.
Remi Rousselet is awesome for creating Provider
It´s fantastic. Thank you.
guys this was an awesome talk. Given that it's been more than a year, can you do a state of the art update on Pragmatic State Management? TIA !:)
I love these guys
Big Love to Google Flutter ❤️
"We spent a long time thinking about how we could make the title of our talk the most exciting and clickbaity title we could make it"
- Every single CZcamsr on this entire damn platform
Verry nice, thank so much 🥳🥳🥳
Great session, thanks guys! Simple question re IDE usage, why are you using vsCode instead of Android Studio?
1. State Management: When we want to change the state of a widget from outside the widget, i.e. from another widget, network, or system call.
//Example
2. In the example the outside entity is: another widget.
3. Making a global state is not a good idea as:
a. It Increases Coupling,
b. Not scalable as there may be more than one implementation of the widget,
c. Calling set state from outside the widget is bad as we'll have difficulty figuring out who changed the state of the widget in case of multiple callers.
4. Let the framework help you instead of fighting it.
5. UI is a function of state in declarative frameworks: UI = f(state) ...(f = build methods that declare what the screen should look like at any given time)
Hence only the state should mutate the UI and not the other UI elements themselves.
6. In order to deal with our previous problem we lift the state up, i.e. make a model at the level that is accessible to both the widgets.
7. When the value of MySlider changes, it notifies MySchedule. MySchedule in turn notifies all its listeners in this case, just MyChart and then notifies MySlider that the update was successful.
8. History of flutter state management:
a. Scoped model: Implementation of #7
b. BLoC: Used for large scale applications. Difficult to understand, implement and a lot of boilerplate code, requires knowledge of Rx and Streams.
9. Currently used: Scoped Model: features a lot of ad-on features to the scoped model.
10. Mixins: medium.com/flutter-community/dart-what-are-mixins-3a72344011f3
11. ChangeNotifier: adds listening capabilities to MySchedule: addListener, removeListener, dispose...
12. Lift the state up. Use the ChangeNotifierProvider widget in MyApp as the parent of MyChart and MySlider.
13. Use the builder in the widget to build the MySchedule model.
14. Get reference of the model from the Widgets can be done by:
a. Consumer, ...(a widget that contains a builder that provides the reference to the model)
b. Provider.of(context)
15. Update the model from it's reference inside the widget. For the listeners, update the listeners by the model reference.
//State "Management"
16. Disposables: Cleaning up when the widget is getting disposed of done with dispose callback of Provider. ChangeNotifierProvider does the dispose part for you.
17. Break your state up into different components and classes to keep it simple. Use MultiProviders when needed.
18. Use anything with the provider, streams, data, whatever
Thank you
ThankYou
THANK YOU
that is What I want in the description thank you !
Of course...
Very clear 👏
@MattSullivan What is that modified version of Bloc pattern, could you share some details?
For Xamarin.Forms developers, this is the nearest thing to the MVVM pattern, ChangeNotifier is like INotifyPropertyChanged
and also the optimized way to check if you should notify or not.
Really cool!
amazing share for provider .
@29:24 haha....was waiting for that. All non-trivial apps that survive will eventually end up with dirty state management.
This made me think. I’m not convinced with the provider package too.
I really think that Flutter team must find a better and simpler way for StateManagement. Flutter is great. I can develop and see the results really fast like never before.
Sometimes, providing many solutions is bad.
Especially in this video, even though the first approach was not good according to the Flutter team, I’d rather using it. At least the children widgets don’t have to be descendants of the same widget in the tree.
These are my thoughts relative to my knowledge.
I watch this everytime i forget how to do this. so thats once a week...
So i am in the club now? 😂 I needed exactly this now i can rewrite everything and i just realized you wrote this comment a year ago 😅
this is super interesting
Remember to turn down your volume after the video ends if you want to preserve your hearing.
#MattApproach is the truth!
that was cool
Thank you for the awesome presentation! Now a real and simple alternative for state management. Source code for the demo?
github.com/2d-inc/developer_quest
Pragmatic State Management in Flutter (Google I/O'19) Example Replica:
github.com/akilaj-oc/hello-flutter/tree/master/2_provider_pie_chart
I Believe Rx is the best since uses Behaviour thingy which unSubcribes by itself on dispose, hence you pass streams to StreamBuilders which dont need to render all the UI and only its subChildrens...
I like this one
What is best state management for flutter as of 2022?
Thanks
So if i'm comfortable w/ both BLoC and Provider, for the next big complicated app, should I use one instead of another? I could not deduce pros and cons of these 2 being compared to each other after watching this presentation.
This is what I'm wondering too...
In your experience, which is the most beginner friendly and easy to use approach among the 2?
You can use both. The provider is a way to provide your state to your widgets. If you manage state through a BloC then you can provide that using the provider. The example here shows that. pub.dev/packages/provider#-example-tab-
Use the one you are most comfortable with. They are both great state management tools.
@@junpeiiori4720 package provider is easier then Bloc in my experience.
It would be nice if the description has the link to the source code with the complete example of the chart application.
Gracias
I will use it with Bloc, because my current issue with Bloc is providing it through the widget tree, I hope it's efficient in that aspect though.
Very efficient, yes. And provider makes it easy to clean up the provided objects, which comes handy with an approach like BLoC.
Also, try package:flutter_bloc :)
The audience didn't pass the vibe check
Fireship dude also talked about this
Can anyone tell me, what Visual Studio extensions are they using for the stuff like "Wrap in a component", "Convert to statefull widget", etc.?
Where can I learn more about nested notifiers? I really often need to update something small within my ViewModel rather than notifying that my entire ViewModel was changed
mark~
3:30 what is state management, widget
approaches
pragmatic
The notifyListeners() does not work when called from inside an async operation like fetching data from network.
4:56 Matt will "Pretend"??🤣🤣
I have a online shop app which has a detail product screen. when user enters, the app should request to backend for detail product. Should i use provider in this case? since i think Provider is a global state management. While i just need the data only for detail screen, not anything else. I mean, notifyListener seems like useless in this case.
I love to learn google technologies.
Basically React props and state 😂👍🏻
i have been search for good architecture for flutter to build my app
i see tdd clean architecture but now i see provider is this is enough to build my app or must use some MVC ????
Where can I get the code of the Chart and Slider using provider and change notifier from this demo????
how if i have some routes, and i want to pass the provider to them?? so on destination route i just call the Provider.of(context)
Thank you for this information , but I want to ask you >> I new to declarative framework , and I want to build a big complex app with flutter , which approach will you recommend me to use it Redux or StreamBuilder , and why ?
Because I don't know which on to use it >> I need advice from expert ..
Thank you again
Try with a small app first
If you are interested in the fisrt demo , you can get it here :github.com/lvsj/control_chart_with_slider. There are several solutions, hope you like it.
Thank you!
Liking this video because of 13:58 - 14:05 lol.
Very good explanation about the State mangament. I am loving the work with provider it's very ease to implement when compared with bloc. But why many people out there and In the medium suggesting the bloc. Can anyone help me out is there any down side in provider when compared to bloc. Thank you.
Flutter is a fastly evolving framework, always pay attention to the date of the post. If it's > 1 year consider it obsolete. Apparently, Provider package didn't exist back then
Good talk. I'm new to Flutter, and since I come from a React background I used Redux for my first Flutter project. It's working just fine, but I'm not entirely sure what the best practices of initial data fetching in Flutter are. How is everybody fetching initial data?
Im also curious about this... in initState() i am sometimes calling 3+ async methods and im not sure if i should chain them and call setState() at the end or use some other approach...
I am using bloc, for global state management..it gives complete control on initial state
Project page: github.com/2d-inc/developer_quest
not seeing where this was posted anywhere else but the github link for the app at 20:11 is github.com/2d-inc/developer_quest
what do you think about pub.dev/packages/flutter_hooks ?
is it a good practice to use it ?
thanks.
I am a totally beginner, self-study. Should I understand it by simply watching to this video, or should I keep learning some more ?
What plugin he just used?
do you guys have the source code of the presented app ?
Very informative! Thanks for the video.
Although the jokes made me cringe
What about react Hooks??
i should buy a same shirt,now++++