Minimal Render Unit Configuration

Background

In the lowcode engine canvas, each node is updated using an incremental update mechanism: when the engine detects a change to a component's parameter configuration via API, only that node is updated.

In some scenarios, a parent component needs to re-render from the parent when a child component's properties change, so it can read the updated child props. For example, a parent may need to forcibly modify children props. Sample code:

React.Children.forEach(children, (child: React.ReactElement) => {
  // Child elements only have behavior, and behavior is 'READONLY'
    const newChild = React.cloneElement(child, {
    behavior: 'READONLY'
  });
})

For this scenario, configure the component as a "minimal render unit". That is:

Rendering and updates for components under a minimal render unit start from the unit's root node. If multiple minimal render units are nested, rendering starts from the outermost minimal render unit.

Component capability configuration (component)

Field	Purpose	Type
isContainer(A)	Whether it is a container component	Boolean
isMinimalRenderUnit	Default: false
Whether it is a minimal render unit	Boolean
...

Configuration example

Standard configuration file

configure.component.isMinimalRenderUnit

{
  "componentName": "Table",
  "title": "Table",
  "category": "Data Display",
  "props": [],
  "configure": {
    "supports": {},
    "props": [],
    "component": {
      // Add the following configuration
      "isMinimalRenderUnit": true
    },
    "combined": []
  },
  "snippets": [],
  "npm": {}
}

Update mechanism

1. If no component is marked as a minimal render unit, each component re-renders when its own properties change;
2. If the root component is marked as a minimal render unit, the entire page re-renders;
3. If a branch node in the component tree is marked as a minimal render unit, property changes on nodes below that branch (including the branch node itself) trigger a re-render of the whole branch; (if multiple minimal render units lie on the same path, rendering starts from the outermost minimal render unit)