Skip to content

Architecture

Jump to bottom
Edgar Mesquita edited this page Jan 25, 2026 · 10 revisions

Arquitetura do eQuantic.UI

O eQuantic.UI é um framework UI self-contained para .NET que compila C# para JavaScript/TypeScript otimizado, eliminando a complexidade de gerir ferramentas frontend externas no dia-a-dia do desenvolvedor .NET.

🏗️ Princípios Core

  1. 100% .NET: O desenvolvedor escreve lógica de UI, estado e eventos em C#.
  2. Self-Contained: O ASP.NET Core serve e compila os componentes. No futuro, integrará ferramentas como Bun de forma transparente.
  3. Hybrid Compilation: Separação clara entre estrutura estática (HTML/CSS) e lógica dinâmica (Eventos/Estado).
  4. Clean Architecture: Segue padrões de DDD (Domain-Driven Design) e CQRS para aplicações escaláveis.

📐 Hierarquia do SDK

O projeto é dividido em camadas que facilitam a manutenção e a extensibilidade:

  • eQuantic.UI.Core: Define as abstrações fundamentais como HtmlNode, IComponent e os atributos de sinalização ([Page], [ServerAction]).
  • eQuantic.UI.Compiler: O "cérebro" do framework. Utiliza Roslyn para analisar o código C# e gerar o TypeScript correspondente.
  • eQuantic.UI.Runtime: A biblioteca client-side (TypeScript) que executa no browser, gerenciando o Virtual DOM e a comunicação com o servidor.

🔄 Fluxo de Compilação

graph TD
    A[C# Component] --> B[Roslyn Parser]
    B --> C[TypeScript Intermediate]
    C --> D[Bundler - Vite/Bun]
    D --> E[Optimized JavaScript]
    E --> F[Browser Execution]
Loading

Por que TypeScript Intermediário?

  • Type Safety: Verificação de tipos em duas camadas (C# e TS).
  • Debug-friendly: Source maps permitem debugar diretamente do C# para o código executado.
  • Otimização: Permite usar ferramentas modernas de mercado (Vite, Bun) para tree-shaking e minificação.

🍱 Estratégia de Identidade (Keyed Diffing)

Para garantir que a UI seja atualizada de forma eficiente sem perder o estado dos componentes (como foco em campos de input), o eQuantic.UI utiliza Keyed Identity. Cada nó pode ter uma Key que o identifica unicamente entre seus irmãos, permitindo que o reconciliador mova elementos no DOM em vez de recriá-los.

Clone this wiki locally