Arquitetura de UI de máquina de estado: indo além do Rive WebAssembly
Explore a arquitetura de UI da máquina de estado. Como máquinas de estado visual, layout e física são enviados de um arquivo para React, Vue e aplicativos nativos.
Ponto principal
Embora Rive tenha sido pioneiro em máquinas visuais de estados finitos para gráficos vetoriais interativos, sua dependência de uma tela WebGL/Skia isolada cria gargalos de acessibilidade e tamanho de pacote para aplicativos da Web de produção. A interface moderna da máquina de estado mantém o gráfico de estado visual em um arquivo que o aplicativo conduz por meio de entradas e eventos.
Por que as máquinas de estado transformaram o design de movimento
Antes das máquinas de estado, a lógica de interação era uma teia caótica de variáveis booleanas (isHovered, isClicked, isExpanded, isError). As máquinas de estado fornecem clareza matemática formal: um componente possui estados definidos, transições discretas e gatilhos determinísticos.
Trecho de implementação em produção
import { ExodeUICanvas } from 'exodeui';
// Springs, states and timing live in the .exode file (designed in the
// editor). Your code passes inputs in and hears events back.
export function CheckoutButton() {
return (
<ExodeUICanvas
src="/checkout.bexode"
onTrigger={(name) => console.log('ExodeUI event:', name)}
/>
);
}