DivKit

  1. How DivKit works
  2. Card examples
  3. Learn more

DivKit is a library for creating cards from JSON elements for applications and websites.

How DivKit works

Typical stack Minimum stack
The library implements a frontend service: DivView is uploaded, cached, and integrated in the client. The platform receives the data for rendering and the components that process actions. It accepts JSON layout as input and builds a UI based on the native DivView platform.
DivJson Interactivity
  • Low: Operates with atomic layout blocks.
  • High: Operates with templates.
  • Independent: Contains information about positioning, design, and interactivity.
  • It is used to describe alternative hierarchies of elements for changing the UI on the fly.
  • The concept of states makes it easy to implement both simple and complex interface style changes.
  • The animation system is used to describe animations of transitions between states.
Templating Customization
Provides encapsulation and reuse, supports inheritance, and reduces parsing size and speed. Allows for the implementation of additional logic to change the behavior and display of any element.
Variables Additional loading

Supports actions for installation and modification, as well as basic conditions. Supported variables:

  • Global: For example, colors.
  • Local: For example, a "likes" counter.
It is used to load new markup. Additional loading can be called automatically or by pressing a button. Fallbacks are supported.
Typical stack Minimum stack
The library implements a frontend service: DivView is uploaded, cached, and integrated in the client. The platform receives the data for rendering and the components that process actions. It accepts JSON layout as input and builds a UI based on the native DivView platform.
DivJson Interactivity
  • Low: Operates with atomic layout blocks.
  • High: Operates with templates.
  • Independent: Contains information about positioning, design, and interactivity.
  • It is used to describe alternative hierarchies of elements for changing the UI on the fly.
  • The concept of states makes it easy to implement both simple and complex interface style changes.
  • The animation system is used to describe animations of transitions between states.
Templating Customization
Provides encapsulation and reuse, supports inheritance, and reduces parsing size and speed. Allows for the implementation of additional logic to change the behavior and display of any element.
Variables Additional loading

Supports actions for installation and modification, as well as basic conditions. Supported variables:

  • Global: For example, colors.
  • Local: For example, a "likes" counter.
It is used to load new markup. Additional loading can be called automatically or by pressing a button. Fallbacks are supported.

Card examples

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