12

I noticed that the build method gets called often in a flutter app.

I know that if the states of the page change in a statefulWidget, the build method gets triggered. But I also noticed that the build method is called even if nothing is changed in the app.

Considering the case where you leave the app to itself, is it normal for the build method to get called frequently? If so, why and how often?

creativecreatorormaybenot
  • 114,516
  • 58
  • 291
  • 402
Vahid Zadeh
  • 564
  • 4
  • 25
  • 1
    The answers go into details, but the TL;DR version is "consider that it might be called 60 times a second, always, so keep it quick and idempotent". – Randal Schwartz Aug 17 '19 at 18:35

2 Answers2

13

Why

The build method is called any time you call setState, your widget's dependencies update, or any of the parent widgets are rebuilt (when setState is called inside of those).

Your widget will depend on any InheritedWidget you use, e.g. Theme.of(context), MediaQuery.of(context) etc.
This means that if the theme changes for example or the screen orientation swaps, your widget will also be rebuilt.

When you use widgets like MaterialApp, Scaffold etc. that are provided by the framework, your widget will be rebuilt a lot because these parent widgets depend on many InheritedWidget's and then are rebuilt, which causes your widget to be rebuilt as well.

How often

There is no number for how many rebuilds are "normal" as this completely depends on your tree size and most importantly widgets are in that tree. If you were to run runApp(Container()), there would be no rebuilds.

Just keep in mind that all of these rebuilds probably have a good reason to occur and Flutter is built for this, so you do not need to worry about this.

The only point you should start worrying is when you have constant rebuilds that are probably caused by some builder (which calls setState internally) you are using incorrectly.

Exactly when

The documentation lists all specific cases when rebuilds can occur:

Rebuilds from parent widgets

If you want to understand how InheritedWidget works, see this answer. It also touches when a rebuild in a parent widget causes the subtree to rebuild.

creativecreatorormaybenot
  • 114,516
  • 58
  • 291
  • 402
  • So the rebuilding on pages doesn't depend on fps + render? What do you think is the reason my build method is called when I leave the app to itself and don't change anything? – Vahid Zadeh Aug 16 '19 at 16:12
  • @VahidZadeh You potentially have a `builder`, or some `setState` somewhere in your tree. You should be able to debug this with [DevTools](https://flutter.dev/docs/testing/debugging) (widget rebuild stats). – creativecreatorormaybenot Aug 16 '19 at 16:21
  • 1
    It's slightly more complicated than that though. There are things like LayoutBuilder that can rebuild for totally different reasons. And the "a parent rebuilt" is not exactly true either. It's based on the == operator of the Widget. – Rémi Rousselet Aug 16 '19 at 16:35
  • @RémiRousselet I was thinking about whether I should include it or not, but I decided to make my use of the "rebuilt" word equal to "rebuilt with a different widget", different as in some data changed (`==` as you said). Is `LayoutBuilder` rebuilding something different than a parent widget calling `setState`? – creativecreatorormaybenot Aug 16 '19 at 16:37
  • 1
    Yes, LayoutBuilder is different. The widget is built inside RenderBox.layout. It's an entirely different mechanism – Rémi Rousselet Aug 16 '19 at 17:26
  • The only issue I have with the "parent rebuilt" thing, is that it makes peoples think that rebuilding the root widget rebuilds the entire tree. – Rémi Rousselet Aug 16 '19 at 17:27
  • @RémiRousselet I linked one of your answers at the end of my question. Do you think that this is enough (considering that these comments might not be read)? You can also propose an edit and I would accept it if that works. – creativecreatorormaybenot Aug 16 '19 at 18:18
0

After calling initState. After calling didUpdateWidget. After receiving a call to setState. After a dependency of this State object changes (e.g., an InheritedWidget referenced by the previous build changes). After calling deactivate and then reinserting the State object into the tree at another location.

Read this for more info https://api.flutter.dev/flutter/widgets/State/build.html

Abdulaziz Yesuf
  • 582
  • 1
  • 6
  • 15