How does Flutter update the status of widgets?
Flutter of the widget tree
Widgets are configured in a Flutter configuration file that is equivalent to Element, such as a Text that sets properties such as Text and textStyle.
Widgets are immutable.
Flutter of the element tree
Element controls which elements are displayed. The Element tree gets configuration information from the widget and renders it with renderObject.
Element is mutable.
When the configuration of the statefulWidget changes,flutter marks the element as dirty, indicating that its internal data has changed.
When executing setState to rebuild the new component tree, determine whether the type runtimeType and identity key of the component at the corresponding position are the same as before. If they are the same, reuse the element, and create a new one if they are not. Rebuild with build method and render with renderObject. Reuse optimizes Flutter performance.
BuildContext
The BuildContext common to Flutter gets the context. The context is actually the element of the widget. Using the context, we can find the element’s position in the tree, and find the corresponding page position in the navigator jump or showDio.
Theme
The of(Buildcontext Context) method of the convention widget in Flutter is used to get the nearest parent widget, for example
Theme. Of (context) gets the current element’s nearest Theme;
Navigator. Of (context) gets the current element’s nearest Navigator;
Flutter renderObject tree
RenderObject is responsible for helping Element render its content.
conclusion
Flutter displays pages through three trees. Widget components act as configuration information, Element elements act as main content, and renderObject assists Element rendering.
When setState is immutable, widgets are discarded and rebuilt, and Element iterates over dirty elements to determine whether to reuse or create new ones.