Перейти к содержанию

Декларативное программирование пользовательского интерфейса в Rust для собственных приложений

Posted on:7 апреля 2023 г. at 08:54

Example Dynamic OG Image link Последние пару недель автор потратил на изучение Rust. Он был очень очарован потенциалом Rust для создания высокопроизводительных приложений, в то же время, он обладает высокоуровневыми абстракциями. Поскольку он пришел из мира web и React, то решил изучить возможности Rust в контексте программирования пользовательского интерфейса. Результатом этого исследования стал Appy, экспериментальный фреймворк, вдохновленный React, который использует возможности производительности Rust для рендеринга компонентов непосредственно с помощью OpenGL.

Эта структура все еще находится на ранних стадиях своего развития, и ее следует понимать как эксперимент. Тем не менее, автор рад поделиться тем, что он узнал на данный момент, и поговорить о возможностях Rust для программирования пользовательского интерфейса.

По своей сути, Appy опирается на Rust, RSX, OpenGL и библиотеку Simple DirectMedia Layer (SDL) для рендеринга графики. SDL обеспечивает кроссплатформенную функциональность, что означает, что приложения, созданные с помощью Appy, потенциально могут быть развернуты на различных платформах. Однако в настоящее время только Android и настольные версии средства развертывания полностью работоспособны. Тем не менее, добавление инструментов iOS или wasm должно быть простым процессом.

Hello World

Если вы знакомы с React, вы узнаете синтаксис Appy, который позволяет вам писать код, похожий на HTML или XML. Это приложение “hello world”:

use appy::{*};

#[main_window]
pub fn app()->Elements {
    apx!{
        <bg col=0x800000/>
        <text text="Hello World".to_string() align=Align::Center/>
    }
}

В отличие от React, Appy не использует виртуальный DOM для управления обновлениями пользовательского интерфейса. Вместо этого Appy рендерит компоненты непосредственно с помощью OpenGL. Такой подход устраняет необходимость в DOM и, следовательно, необходимость его обновления. В результате получается более компактная, быстрая и эффективная платформа, которая обеспечивает значительные преимущества в производительности по сравнению с традиционными платформами пользовательского интерфейса.

Хуки

В Appy концепции React-хуков присутствует. Хуки - это способ использования состояния и других функций React в функциональных компонентах без необходимости использования компонентов класса. В Appy я использую аналогичный подход с замыканиями Rust.

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

use appy::{*};

#[main_window]
pub fn app()->Elements {
    let (v,set_v)=use_state(||1);
    let on_button_click=cb_with_clone!([v,set_v],move||{
        set_v(*v+1);
    });

    let s=format!("Hello: {}",*v);

    apx!{
        <blk top=Pc(25.0) height=Pc(25.0)>
            <text text=s.to_string() align=Align::Center size=Pc(100.0)/>
        </blk>
        <blk top=Pc(50.0) height=Pc(20.0) width=Pc(25.0)>
            <bg col=0x808080/>
            <text text="+1".to_string() align=Align::Center size=Pc(100.0)/>
            <interaction on_click=on_button_click/>
        </blk>
     }
}

Деплой

В рамках эксперимента автор пакета также создал инструмент развертывания. Развертывание приложения Appy на Android - это простой процесс, который включает в себя выполнение одной команды. Он нашел в Интернете учебные пособия, в которых объяснялось, как настроить SDL и запустить его на Android. Это был довольно трудоемкий процесс, который включал в себя несколько этапов копирования файлов туда и обратно и, наконец, открытие Android Studio для сборки проекта. Автор автоматизировал процесс, чтобы сделать его намного проще и эффективнее, чтобы запуск проекта не казался препятствием.

Вывод

Код для Appy доступен на GitHub вместе с некоторыми примерами, которые помогут вам лучше разобраться. Один из примеров - простой калькулятор, который автор создал, чтобы получить представление о том, каково это - использовать фреймворк.

Я нахожу рабочий процесс использования Appy довольно приятным. Возможность писать код в функциональном стиле и при этом получать встроенную производительность без необходимости иметь дело с виртуальным DOM было свежим решением. Использование замыканий Rust для обработки обновлений состояния и других событий казалось естественным и интуитивно понятным.

Хотя Appy все еще находится на стадии эксперимента, автор пакета считает, что у него есть потенциал в качестве кроссплатформенной платформы пользовательского интерфейса для разработчиков Rust. Возможность использовать SDL и OpenGL для бизнес-приложений и приложений для повышения производительности и может кардинально изменить ситуацию как с точки зрения производительности, так и с точки зрения продуктивности разработчиков.

Он рад продолжить работу над Appy и изучить возможности декларативного программирования пользовательского интерфейса в Rust. Если вы заинтересованы в том, чтобы попробовать пакет или внести свой вклад, не стесняйтесь ознакомиться с кодом на GitHub и присоединиться к проекту.