Вопросы и ответы

Кроссплатформенная библиотека, основанная на подходе Server-Driven UI, которая позволяет строить пользовательский интерфейс приложений и сайтов на основе описания верстки в формате JSON.

Концепция разработки, в которой верстка страниц и приложений формируется на сервере. Затем описание верстки передается на клиент, где на основе этого описания автоматически отрисовывается пользовательский интерфейс.

Такая концепция позволяет:

• Изменять внешний вид приложения и добавлять новые визуальные элементы без выпуска новой версии приложения.
• Использовать одну и ту же верстку страницы на разных платформах.

Клиентская часть DivKit поддерживает iOS, Android, Web.

Правила AppStore и Google Play не запрещают обновлять пользовательский интерфейс приложений на основе данных, полученных с сервера, при условии, что эти обновления не меняют первоначальный смысл приложения.

Да. DivKit — это библиотека с открытым исходным кодом, выпущенная под лицензией Apache License, Version 2.0.

По нашему опыту, отрисовка «тяжелых» страниц в среднем занимает менее 16 миллисекунд. DivKit работает многопоточно и может повторно использовать ранее отрисованные элементы. Это позволяет быстро просчитывать текстовые элементы (например, большие объемы текста или таблицы) и в целом ускорить работу интерфейса.

Описание карточки в формате JSON можно хранить на сервере или локально на устройстве.

Чтобы генерировать описания верстки карточек в формате JSON, можно использовать библиотеку json-builder, которая доступна для Kotlin, TypeScript и Python.

Верстка карточки должна быть описана в формате JSON по определенной схеме.

Чтобы подготовить JSON-описание верстки и увидеть превью карточки в веб-формате, можно использовать DivKit Web Playground. Затем вы можете передать ваш JSON-файл в приложение DivKit Playground для Android или iOS и посмотреть, как верстка отображается на мобильном устройстве.

DivKit поддерживает действия, которые можно вызывать при нажатии на элемент. С помощью действий можно менять состояние элементов, дозагружать данные или вызывать обработчики событий, которые реализованы на уровне приложения-хоста.

Также DivKit поддерживает использование переменных и триггеров. Триггер срабатывает при изменении значения переменной и вызывает одно или несколько действий.

Да, например с помощью переменных. Если значение какого-либо свойства задано через переменную, при изменении переменной представление будет перестраиваться.

Логику можно обрабатывать с помощью переменных, вычисляемых выражений и триггеров. Также DivKit содержит набор функций для работы со строками, датами и числами.
Например, если пользователь ввел текст в поле, это значение можно передать в переменную. При изменении значения переменной срабатывает триггер и вызывает определенное действие.

Да, DivKit поддерживает несколько видов анимации: переходы при переключении состояний, нажатия на кнопки, а также появление и исчезновение элементов.

Да, можно. Например, в приложениях Яндекса часто карточки DiKit интегрируют на один или несколько экранов.

Да, для этого используйте элемент div-input, который предназначен для ввода текста.

Да, в DivKit существуют элементы, которые обеспечивают доступность для людей с ограниченными возможностями.

Специальные механизмы локализации не предусмотрены. Чтобы локализовать элементы интерфейса, сформируйте отдельные JSON-файлы верстки для каждого языка.

У нас нет готового решения, с помощью которого можно развернуть сервер. DivKit содержит библиотеки для формирования JSON-файлов верстки, которые вы можете интегрировать в свой сервер.

Используйте переменные. Например, с сервера можно получать палитру в виде комбинации двух цветов для каждого элемента. На стороне клиента следует выставить переменные, которые обозначают, какие цвета использовать для элементов.

Для правильного логирования параметр log_id должен быть уникальным. Например, при логировании карточек в карусели у каждой карточки должен быть свой log_id, иначе залогирована будет только первая карточка, а все остальные будут считаться дублями.

В элементе animation укажите "name": "no_animation".

Чтобы добавить Lottie-анимацию, в элементе image задайте массив extensions. Подробнее см. в разделе Кастомизация.

Если нужен блок, который будет просто занимать место, то используйте элемент separator и укажите для него прозрачный цвет в параметре color.

Не стоит, это отразится на производительности. Постарайтесь не создавать лишних оберток.