Why do we need stateless widgets if the same can be achieved by stateful widgets in flutter?

Question

I am a newbie in the world of flutter, and I recently learned (or I think I did) about stateful and stateless widgets which is kind of the base for flutter widgets.

We use stateless widgets for things that are not redrawn on the display, (like text, button etc.) but stateful widgets can redraw themselves.

So my question is why do we need stateless widgets if stateful widgets can be used to draw the same kind of widgets that a stateless widget can?

Or is there any specific reasons to use stateless over stateful widgets in flutter? Or can we use stateful widgets all the time rather than stateless widgets which can draw content only once?

Thanks, and sorry if this is a stupid question.

EDIT

Well the question is not the difference between stateless and stateful. I know the difference but what is the impact of using only stateful widgets since by using it we could also implement most of the things a stateless widget can do then why do we need stateless widgets?what's the importance of it in a flutter environment were most of the apps will be re-drawn time-to-time?

Surrealism

I am also learning Flutter nowadays & I think that Flutter has to do some extra work to manage the Stateful widget under the hood as compared to the Stateless widget. May need expert's opinion here. – Chaddie

yea, it feels weird to me. if there is a widget that can redraw your screen then we can use that rather than a widget that can only draw once, right? – Surrealism

I think stateless widgets are lightweight as they don’t need to refresh/regenerate when you call setState(). That’s why you should use them whenever you think the task can be done by stateless widgets. – Lair

is there any correct answer to this question? – Surrealism

It's based on your purpose, you could always use StatefulWidget, and do the stateless thing. To be honest, If you have a list of widget(100+?1000+?), you probably do not need the state themself. But that's all depend on your design... This seems to be opional based than coding. – Dire

I understand, but this is bugging me a lot lately – Surrealism

Possible duplicate of What difference between stateless and stateful widgets? – Anaphase

it's not basically, that questions answers the difference yes, but not my question completely – Surrealism

I would say its quite the opposite. I think we should only make stateless widgets and make them stateful by using any kind of state management methods. This way developer have full control on each and every piece of code which is updated , rather than using stateful widgets and not knowing how things are being updated. – Fonsie

Answer 1

From their documentation:

Stateless widget are useful when the part of the user interface you are describing does not depend on anything other than the configuration information in the object itself and the BuildContext in which the widget is inflated. (= use when you don't need to "update the UI here").

Stateful widgets are more resource consuming and you always need to think about performance.

Here is more about this.

Push the state to the leaves. For example, if your page has a ticking clock, rather than putting the state at the top of the page and rebuilding the entire page each time the clock ticks, create a dedicated clock widget that only updates itself.

Even more on this :)

I hope this answers your question.

Anaphase

but is there any app that doesn't redraw occasionally? If that's the case then most of the widgets will be stateful right? – Surrealism

Ofcourse they redraw but the point is to make the apps as smooth as possible and one way you can do this is by having less to build when calling setState for example. Maybe on some "lightweight" screen running on a "powerful" device all will seem fine, but when this changes you might experience some UI that is not that nice ( slow/jerky/unresponsive ) – Anaphase

so let't assume that over time stateful widgets are optimized, then we could only use stateful widgets than stateless right? – Surrealism

Even so why would you use an overhead (the state object) on a widget when you don't need it or use it? Yes, you could use a Stateful instead of a Stateless every time but that is breaking KISS or any other clean code guideline. You will have stuff you will never use, which is usually a bad sign. – Anaphase

Answer 2

Yes, StatefulWidget can rebuild. That happens typically when using Inheritedwidgets.

StatelessWidget exists to split a big widget tree into smaller reusable widgets.

You might think "but I can use StatefulWidget or functions for this". Which is true, but not exactly:

• StatefulWidget comes with a huge boilerplate, which you do not need in that situation. So this just adds noise and makes your code less readable.
• Functions cannot rebuild independently, nor to they have access to key and override ==. So they can be less performant or introduce bugs.

Warton

Answer 3

This is what I understand ...

When you use a stateful widget and redraw it, all other widgets inside will be redrawn as well. So we try to use stateless widgets so as not to redraw the other widgets within them, but you know we generally need to change the data on the screen and it should happen inside a "single widget" and this widget should be the one stateful widget to use as little computing power as possible.

Now ... I guess you're thinking: "but what if i just use stateful widgets and don't redraw them?" well, as you know, when you use a stateful widget you have two classes: widget and state. I have gotten that when you declare a state you tell the phone to keep and save this state in memory whether the widget is redrawn or not, so you use the phone memory for no reason because you don't need to redraw its widget.

We should think about always using stateless widgets because they are lighter than stateful widgets and we should always make our stateful widgets the smallest in our application to redraw as few widgets as possible in the widget tree of the application.

I hope I helped a little.

Equimolecular

Answer 4

Every time we use a Stateful widget, a state object is created. If we use all Stateful widgets, there will be a lot of unnecessary state objects which will consume a lot of memory. So where we don't need to change the state, we should use the simpler one - the Stateless widget.

Another reason to use Stateless widgets over Stateful widgets is Stateful widget comes with a huge boilerplate and according to Flutter API Documentation using a bunch of nested Stateful widgets, passing data through all those build methods and constructors can get cumbersome.

Cowfish

Answer 5

Theoretically I think you can use stateful widgets every where, but your overall program would be heavier and would have a lot of redundancies. That said, I don't think there is any advantage of using stateless widgets over stateful widgets.

Rickrickard