The Mahogany Staircase - Flutter's Layered Design
Why Stack Overflow recommends it
Stack Overflow users link it when explaining how Flutter's widgets, elements and render boxes work, and why rebuilds and const widgets are cheap.
Recommended by 3 people across 4 different months, 2017 to 2021.
What it is
A 2016 Google Tech Talk by Ian Hickson, Flutter's framework architect, on why Flutter is built as a stack of layers. He starts from an app written against the low-level paint APIs and rebuilds it layer by layer up to the Material library, explaining the design reasons at each step.
What people said
Recommends German Saprykin · 2017-08 · Stack Overflow · on “Should Flutter widgets be created in the class or in the build() function?”
Imho, flutter was built with idea of re-building, but only when needed. So, the framework is trying not to rebuild if no changes in widgets. I found very useful this talk [this video] . I am building an app now, and don't have problems with performance.
Recommends Rémi Rousselet · 2017-12 · Stack Overflow · on “What color system does flutter use and why do we use `const Color` instead of `new Color`”
As explained by the accepted answer, const constructors are a small optimization. In dart a const MyObject(42) will only be allocated once even when you call it hundreds of time. Which means less memory allocation > faster But isn't it a negligible optimization ? Well, from dart point of view, yes. But we're in flutter here. We also have a Widget tree that can also use const constructors. Which means that we could change your code example to something like this : return const DecoratedBox( decoration: const BoxDecoration( gradient: const LinearGradient( colors: const [ const Color(0xFF3366FF), const Color(0xFF00CCFF), ], begin: const FractionalOffset(0.0, 0.0), end: const FractionalOffset(1.
Recommends Rémi Rousselet · 2017-12 · Stack Overflow · on “What color system does flutter use and why do we use `const Color` instead of `new Color`”
Yeah but in this case, it's the flutter team that recommend const widgets for this exact purpose. Because it will skip the `build` method call. Also : [this video]
Recommends Rémi Rousselet · 2018-03 · Stack Overflow · on “Flutter: How to correctly use an Inherited Widget?”
The problem comes from your quote, which is incorrect. As you said, InheritedWidgets are, like other widgets, immutable. Therefore they don't update . They are created anew. The thing is: InheritedWidget is just a simple widget that does nothing but holding data . It doesn't have any logic of update or whatsoever. But, like any other widgets, it's associated with an Element . And guess what? This thing is mutable and flutter will reuse it whenever possible! The corrected quote would be : InheritedWidget, when referenced in this way, will cause the consumer to rebuild when InheritedWidget associated to an InheritedElement changes. There's a great talk about how widgets/elements/renderbox are
Recommends danI · 2018-05 · Stack Overflow · on “setState() rerendering of particular Widget. Need code fix”
Flutter will determine which Widgets need to be recreated or rebuilt, and only recreate / rebuild those. IIRC, on each setState() (or animation tick, or other re-render), Flutter traverses the Widget tree and compares the before and after state of each Widget tree branch. A stateful widget is only rebuilt if its state has actually changed, and only changed stateless Widgets will be recreated. So in your case, _MyHomePageState is rebuilt, but only the second Text widget is recreated. See [this video] for a far more detailed explanation of Widgets (and underlying elements and render boxes).
Cites user1462442 · 2018-10 · Stack Overflow · on “Performance implications of FittedBox?”
I wouldn't worry too much about performance Flutter is designed to use simple algorithms to achieve 60 fps 1 pass layout composition O(n) Separated layout and painting Children tell the parent to invalidate the subtrees etc. [LINK] [LINK] [LINK] [this video] I cannot say the all the performance implications but it shouldnt matter.
Cites omnesia · 2021-01 · Stack Overflow · on “Flutter: setState() doesn't execute until the enclosing function returns”
If you want to run code after the widget is rebuild use: WidgetsBinding.instance.addPostFrameCallback((_) { //doStuffAfterNextBuild }); The function passed to setState is run directly. "The provided callback is immediately called synchronously" setState only marks the widget as dirty. "Calling setState notifies the framework that the internal state of this object has changed" setState does not itself manipulate your state in any way. (Quotes from [LINK] ) See for example the following: class _MyWidgetState extends State<MyWidget> { String s = "" // ... Somewhere in the tree onPressed: () { // State is updated immediately with this call setState(() { this.s = "1"; // Implementation of setStat