FAQ

DivKit is a cross-platform library based on the Server-Driven UI approach. It lets you build user interfaces for apps and sites using a layout description in JSON format.

It's an architectural pattern where the page or app layout is generated on the server side. The layout description is then sent to the client, which renders the UI automatically based on this description.

With this approach, you can:

• Change your app's appearance and add new visual elements without releasing a new app version.
• Use the same page layout across different platforms.

On the client side, DivKit supports iOS, Android, and Web platforms.

Neither the App Store nor Google Play prohibit updating the user interface of your app based on data received from the server, as long as these changes don't alter the app's original purpose.

Yes. DivKit is an open-source library released under the Apache License, Version 2.0.

In our experience, loading an average heavy web page takes less than 16 ms. DivKit supports multithreading and can reuse previously rendered elements. This speeds up calculations for text elements (such as large blocks of text or tables) and makes the interface faster overall.

Card descriptions in JSON format can be stored on the server or locally on the device.

To generate JSON descriptions of card layouts, you can use the json-builder library, which is available for Kotlin, TypeScript, and Python.

The card layout must be described in JSON format using a specific schema.

To prepare a JSON layout description and preview the card in web format, use DivKit Web Playground. You can then transfer your JSON file to the DivKit Playground app for Android or iOS and see what the layout looks like on a mobile device.

DivKit supports actions triggered by a tap on an element. With actions, you can change element states, load additional data, or call event handlers implemented at the host app level.

In addition, DivKit supports variables and triggers. A trigger is set off by changes in the variable's value, prompting one or multiple actions to occur.

Yes. For example, you can achieve this using variables. If the value of a property is set through a variable, its representation updates when that variable changes.

Logic can be handled using variables, calculated expressions, and triggers. In addition, DivKit provides a set of functions for working with strings, dates, and numbers.
For example, if a user enters text in a field, you can pass this value to a variable. This change in the variable's value will set off the trigger and prompt the associated action.

Yes, DivKit supports several types of animation, including transitions on state changes, button taps, as well as appearance and disappearance of elements.

Yes, you can. For example, in Yandex apps, DivKit cards are often integrated into one or multiple screens.

Yes. To do this, use the div-input element, which is specifically designed for text input.

Yes, DivKit has elements that ensure accessibility for people with disabilities.

The service doesn't offer any dedicated localization features. To localize interface elements, create separate JSON layout files for each language.

We don't have an out-of-the-box solution for server deployment. However, DivKit provides libraries for generating JSON layout files that you can then integrate into your server.

Use variables. For example, for each element, you can retrieve a palette consisting of two colors from the server. On the client side, define the variables that should determine which colors to use for specific elements.

For proper logging, the log_id parameter must be unique. For example, when logging cards in a carousel, each card must have its own log_id, otherwise only the first card will be logged, and all the others will be considered duplicates.

In the animation element, specify: "name": "no_animation".

To add a Lottie animation, specify the extensions array in the image element. For more information, see Customization.

If you need a block that will just take up space, use the separator element and set its color parameter to transparent.

It isn't worth it, it will affect performance. Try not to create unnecessary wrappers.