1. Each widget corresponds to an element
  2. A createRenderObject is created if the widget inherits a parent class of type RenderObject
  3. The RenderObject is a real RenderObject, and the widget is just a shell or composite control or a configuration file; Widgets change a lot and are unstable, so the Flutter engine is connected to the RenderObject;
  4. Element is a middleman, holding widgets and RenderObjects; Dealing with some of the ways in life; For example, the StatefulElement constructor calls the createState method, initializes the state object, and the build method calls state.build();

The data structures of all three objects are trees

Since RunApp

AttachRootWidget call attachToRenderTree

The attachToRenderTree method initializes the Element of the root widget and then calls its mount(). This method is modified by mustCallSuper. Subclasses mustCallSuper’s method

Whether StatelessWidget or StateFulWidget, their Element inherits ComponentElement, In its mount() call _firstBuild->rebuild->performRebuild, performRebuild-> build() and updateChild, respectively

UpdateChild calls the inflateWidget method to determine whether it is first created or updated; The createElement and mount methods are called for the first time;

If is MultiChildRenderObjectWidget mount, will traverse the child nodes widget, inflateWidget method can judge whether to create or update for the first time; So the recursion goes all the way to the last node in the tree