# Dynamic

# Overview

The Dynamic module allows us to load downloaded or cached JSON for rendering.

The semantics are close to the original Flutter component name. For the specific mapping relationship, please refer to Document.

Regarding the implementation, Dynamic deserializes the incoming JSON string into a built-in object model, then generates a widget tree, and finally passes the root node of the tree to the container widget.

# Instructions

Because Google disables dart: mirrors on Flutter, which results in weak dynamics. Dynamic is based on Flutter widgets. Some interactive scenes cannot be supported temporarily. It is recommended to use Dynamic in some static display areas.

Dynamic parses the incoming JSON string, but you can also parse other formats such as XML or Protobuf into the specified model object, and then pass it to the container view to render it.

When you download the data, you can set a placeholder loading widget for the specified container as shown below:

# Performance

# Time Profiling

Here uses Extend GitHub Demo (pic above Overview) . The length of the json string is 5068 and the deepest nesting level is 9. Below is the time consumption on different devices：

Stage \ Device	iPhone 7 Plus	iPhone X	OnePlus 7 Pro
JSON Serialization	1 ~ 8 ms	1 ~ 10 ms	2 ~ 16 ms
Generate Content Widget	0 ~ 2 ms	0 ~ 1 ms	0 ~ 3 ms
Total Time (init -> first frame render finished)	54 ~ 106 ms	41 ~ 75 ms	85 ~ 160 ms

Dynamic related time is low, the main time consumption is still in the rendering stage.

# Frame Rate

In terms of frame rate (data tested on OnePlus 7 Pro), the rendering widget tree with push animation process, the longest frame drawing time is 30 ~ 40 ms, and most of the time is concentrated in 6 ~ 10 ms / frame, at a certain time Frame rate fluctuation as an example：

The frame rate fluctuation of rendering the same native widget tree is similar to using Dynamic, and there is no obvious difference.

# Memory

Still using Extend GitHub Demo, the top ten objects in memory snapshot at a time are as follows：

The top five Dynamic models are as follows:

The objects in the widget ( including elements, semantics, rendering objects ) tree occupy a relatively high proportion in memory, but it is also necessary to pay attention to the number of Dynamic models.