← Все статьи

euv: UI-фреймворк на Rust и WebAssembly для браузера

Вводный гайд по euv: виртуальный DOM, реактивные сигналы, макрос html! и mount — декларативный фронтенд с типобезопасностью Rust и сборкой в WASM.

Содержание

Коротко

euv — ещё один кандидат в линейку «Rust + WASM на фронте», но с акцентом на привычную декларативную модель, а не на низкоуровневые привязки. Имеет смысл попробовать на изолированном виджете или внутреннем инструменте, прежде чем ставить на весь одностраничный интерфейс — цепочка сборки WASM всё ещё требует дисциплины в CI и контроля размера артефакта.

Что произошло

На Dev.to вышел стартовый гайд: установка через cargo add euv, минимальное приложение «Hello, euv!» и разбор базовых концепций. Корневая функция возвращает VirtualNode, разметка описывается в макросе html!, монтирование — вызовом mount("#app", app).

Фреймворк заявляет набор возможностей «из коробки»:

  • Rust + WASM — фронтенд на языке с проверкой типов, близкая к нативной скорость в браузере.
  • Виртуальный DOM — diff/patch вместо прямых массовых операций с DOM.
  • Реактивные сигналыuse_signal, computed!, watch!; обновляются только затронутые узлы.
  • Компоненты — переиспользуемые блоки с типизированными props.
  • Анимации — встроенные CSS keyframes (euv-spin, euv-fade-in и др.).
  • Доступ к браузерным API — Window, Document, Storage, Clipboard через prelude.
  • Асинхронностьspawn_local, работа с Promise и Response.

Пример со счётчиком показывает паттерн: сигнал count, обработчик onclick с count.get() / count.set(...), автоматический перерендер затронутых частей UI.

Почему это важно

Экосистема «Rust в браузере» давно обещала альтернативу JS-фреймворкам, но порог входа часто высок: другой toolchain (wasm-pack, trunk), другая модель ошибок, меньше готовых UI-библиотек. euv ставит на знакомый declarative UX — макросы вместо JSX, сигналы вместо hooks — и снижает когнитивный разрыв для тех, кто уже знает React/Solid.

Для команд с Rust на бэкенде это шанс унифицировать язык на full-stack без «двух миров» типов. Для экспериментов — способ проверить, насколько WASM-UI конкурирует с привычным бандлом на тяжёлых интерактивных виджетах.

На практике

  1. Подготовьте WASM-проектtrunk или wasm-pack для сборки и dev-сервера.
  2. Добавьте зависимостьcargo add euv.
  3. Опишите корень — функция -> VirtualNode с html! { ... }.
  4. Смонтируйтеmount("#app", app) или селекторы body, .root, main.
  5. Состояниеuse_signal для локального state; для производных значений — computed!.
  6. Событияonclick: move |event| { ... } внутри элементов макроса.
Концепция Аналог в JS-мире
html! JSX / шаблоны
use_signal useState / signals
mount createRoot().render
VirtualNode Virtual DOM tree

Итог

euv — ещё один кандидат в линейку «Rust + WASM на фронте», но с акцентом на привычную декларативную модель, а не на низкоуровневые binding'и. Имеет с sense попробовать на изолированном виджете или внутреннем инструменте, прежде чем ставить на весь SPA — toolchain WASM всё ещё требует дисциплины в CI и размере артеfactа.