Skip to content

Runtime

Edgar Mesquita edited this page Jan 25, 2026 · 5 revisions

Runtime (TypeScript)

O eQuantic.UI Runtime é a biblioteca que dá vida à aplicação no browser. Ela é responsável por transformar a árvore virtual gerada pelo código compilado em elementos DOM reais e reagir às mudanças de estado.

🔄 O Reconciliador (Reconciler)

Diferente de frameworks que recriam o DOM inteiro, o Reconciler do eQuantic.UI compara a página atual com a nova versão desejada e aplica apenas as mudanças mínimas necessárias.

Algoritmo de Diffing:

  1. Comparação de Tipos: Se o nó mudou de tag (ex: div para span), ele é substituído inteiramente.
  2. Atualização de Atributos: Apenas atributos modificados são alterados no DOM.
  3. Gestão de Filhos: O reconciliador percorre a lista de filhos de forma recursiva.

🗝️ Keyed Identity

Com a introdução do Keyed Diffing, o reconciliador agora suporta a propriedade key.

  • Se dois nós em posições diferentes possuem a mesma chave, o framework entende que o elemento foi movido, preservando o estado interno do browser (como o cursor dentro de um input ou o estado de scroll).

🧠 Gestão de Eventos e Memória

Para evitar vazamentos de memória (memory leaks), o runtime utiliza um sistema de rastreamento de eventos baseado em WeakMap.

Vantagens do WeakMap:

  • Os event listeners são mapeados diretamente para o HTMLElement.
  • Quando um elemento é removido do DOM e não há mais referências a ele, o Garbage Collector do browser pode limpar automaticamente os metadados dos eventos, garantindo que o consumo de memória da aplicação permaneça estável mesmo em sessões longas.

💧 Hidratação (SSR)

O runtime suporta o processo de "Hidratação", onde ele assume o controle de um HTML já renderizado pelo servidor (SSR). Em vez de destruir e recriar, o runtime apenas anexa os event listeners necessários aos elementos existentes, garantindo um carregamento inicial instantâneo.

Clone this wiki locally