Reusing blocks on Android

DivKit reuses blocks during the following events:

Setting new DivData.
Scrolling elements in complex containers: gallery, grid, tabs.

Reuse when new DivData is set

DivKit always attempts to reuse already created elements.

If the structures of DivData match

Structure of the old DivData:

 - container
  - image
    - url: "old_image"
  - text
   - text: "old_text"

Structure of the new DivData:

 - container
  - image
    - url: "new_image"
  - text
    - text: "new_text"

In this case, when setting the new DivData, DivKit will simply replace the data inside the view because the tree structure hasn't changed.
This is a fast and preferred process when setting DivData.

If the structures do not match

Structure of the old DivData:

 - container
  - image

Structure of the new DivData:

- container
  - video

In this case, DivKit will destroy the already created views and create new ones. This process takes longer compared to reusing.
It should be taken into account when designing layouts.

Reuse in complex containers

DivKit reuses list containers in the order they are released.

Suppose your gallery consists of uniform elements, and only one element is visible on the screen at a time:

- gallery
  - container
    - image
    - text
  - container
    - image
    - text
  - container
    - image
    - text

Then, when switching to the second element, the first will be released and reused by DivKit when loading the third element.
Data will be set corresponding to the reuse hierarchy during setting new DivData.

Therefore, reuse by default will not work if the elements of your list have different structures. For example:

- gallery
  - container
    - video
    - text
  - container
    - image
    - text
  - container
    - image
    - text
  - container
    - video
    - text

Container 1 will not be able to be reused when creating the third element, and 2nd when creating the 4th element.
As a result, the heavy video object will be unnecessarily destroyed and recreated.

To indicate the type of container element structure, use the reuse_id field of the element.
This way, DivKit can more effectively reuse elements. For blocks with reuse_id, only blocks with the same reuse_id will be proposed for reuse.

Example:

{
    "type": "gallery",
    "items": [
        {
            "type": "container",
            "reuse_id": "video_block",
            "items": [
                {
                    "type": "video",
                    ...
                }
            ]
        },
        {
            "type": "container",
            "reuse_id": "image_block",
            "items": [
                {
                    "type": "image",
                    ...
                }
            ]
        },
        {
            "type": "container",
            "reuse_id": "image_block",
            "items": [
                {
                    "type": "image",
                    ...
                }
            ]
        },
        {
            "type": "container",
            "reuse_id": "video_block",
            "items": [
                {
                    "type": "video",
                    ...
                }
            ]
        }
    ]
}

Attention! DivKit does not check whether the structure of elements with the same reuse_id is identical. When setting the same reuse_id for elements with different structures, the block will be erased and recreated. It's as if the reuse_id had not been set.

Learn more

Follow DivKit news in the Telegram channel: http://t.me/divkit_news

You can also discuss topics of interest in the DivKit user community in Telegram: https://t.me/divkit_community_ru

DivKit Repository