Controlled widgets

Introduction

The Duit framework provides users with the opportunity not only to create and update application UI from the server side, but also to dynamically update the properties of specific widgets. This is achieved because duit widgets implement a concept called "controlled widgets". This means that a widget whose controlled property was set to true can be updated from the server side (more precisely, its properties - attributes) are updated.

To improve performance, widgets are uncontrolled by default. They inherit from StatelessWidget and do not create additional overhead. But some widgets (for example Checkbox or TextFeield) are always сontrolled=true (see this in list of supported widgets).

Description of the update process

The process of initializing a tree of duit widgets, receiving and processing an update (or other event) is as follows:

1. Establishing a connection to the server using transport
2. Getting an initial description of the widget structure
3. Start parsing the previously obtained structure and creating DuitTree
4. Recursively traversing the structure and creating a new element for each occurrence
5. During the creation of an element, the controlled property is checked. If the property is true, then a controller is created for the element, which is then registered in the driver using the key, which is the id of the element.
6. The end of the structure parsing process. Rendering (if required)
7. Receiving a special object that describes how and which widgets should be updated. This happens as a reaction to some action or push event (from websocket)
8. The object is a dictionary, where the key is the id of the element, and the value is a set of attributes that need to be updated in a specific widget
9. For each entry in the update dictionary, the driver calls a controller method that initiates the widget update process

As a result, we update only those widgets for which the server sent an update.