# Comparador de Diferenças de Texto e Código Online: Arquitetura Técnica e Guia Avançado

A comparação algorítmica de texto, esquemas estruturados e código-fonte é indispensável no desenvolvimento de software, automação de DevOps e auditoria técnica. Seja ao inspecionar um pull request, revisar desvios de configuração (configuration drift) ou validar contratos, exatidão matemática e velocidade são essenciais.

O Comparador de Diferenças de Texto e Código do ToolsAA executa 100% no navegador, integrando um verificador de diferenças de texto (diff checker online), visualizador de código em paralelo (side-by-side) e gerador de patches Git e POSIX. Sob o princípio de conhecimento zero (zero-knowledge), o motor processa tudo no cliente (client-side), sem envio a servidores, telemetria ou vazamento de dados. Este guia analisa o algoritmo de Myers, arquitetura web no navegador, implementações em TypeScript e Python, e casos limite.

# Visão Geral e Casos de Uso em Produção

Ferramentas modernas de comparação determinam a sequência mínima de transformações para converter um documento original em uma versão modificada, isolando adições, remoções e ajustes intra-linha com precisão por ponto de código (code point).

[ Documento Original ]                     [ Documento Modificado ]
         \                                       /
          v                                     v
+-------------------------------------------------------------+
|        Motor de Comparação Diff no Navegador ToolsAA        |
|  - Zero Telemetria de Rede (Avaliação 100% no Cliente)      |
|  - Normalização (CRLF -> LF, Unicode NFC, Espaços)          |
|  - Travessia em Grafo de Edição O(ND) de Eugene Myers       |
|  - Tokenizador Intra-Linha Preciso (\p{L}\p{N} RegEx)       |
+-------------------------------------------------------------+
               |                               |
               v                               v
   [ Visão Dividida (Split) ]      [ Patch Unificado (POSIX/Git) ]

# Casos de Uso Críticos em Engenharia

• Commits e Pull Requests: O comparador de código online realça variáveis renomeadas e mutações lógicas sem alternar branches locais no Git.
• Auditoria de IaC: Compare manifestos de Kubernetes, Terraform e Docker Compose entre ambientes, protegendo segredos e credenciais internas.
• Migrações SQL: Audite esquemas DDL e planos EXPLAIN no PostgreSQL e MySQL, verificando índices e integridade lógica.
• Payloads JSON: Identifique propriedades removidas e alterações de tipagem em respostas REST e GraphQL.
• Contratos Legais: Compare termos de serviço e NDAs, detectando cláusulas de responsabilidade e prazos modificados.

# Privacidade Absoluta no Cliente

Comparadores web legados enviam dados a servidores remotos via HTTP POST, expondo código proprietário e credenciais em logs de acesso. O Comparador de Texto do ToolsAA opera em Modelo de Zero Servidor: ao comparar texto online, tokenização, cálculo e renderização ocorrem na sandbox local do navegador. Cero dados deixam seu dispositivo.

# Arquitetura Técnica e Funcionamento Interno

A comparação algorítmica moderna resolve a Subsequência Comum Mais Longa (LCS), matematicamente dual ao Script de Edição Mais Curto (SES).

# 1. O Algoritmo O(ND) de Eugene Myers

O Git implementa o algoritmo de Eugene Myers (1986). Dadas sequências $A$ ($N$) e $B$ ($M$), modela a comparação sobre um grafo de edição (edit graph) em grade $(N+1) \times (M+1)$:

• Passo horizontal $(x, y) \to (x+1, y)$: Remoção de $A[x+1]$ (custo 1).
• Passo vertical $(x, y) \to (x, y+1)$: Inserção de $B[y+1]$ (custo 1).
• Passo diagonal $(x, y) \to (x+1, y+1)$: Coincidência $A[x+1] == B[y+1]$ (custo 0).

Busca-se o trajeto ótimo de $(0,0)$ a $(N,M)$ minimizando o custo $D$:

• Diagonais: $k = x - y$, onde $k \in [-M, N]$.
• Maior alcance: O vetor $V$ registra o maior $x$: $x = \max(V[k-1] + 1, V[k+1])$.
• Avanço guloso (snakes): Percorre arestas diagonais sem custo enquanto $A[x+1] == B[y+1]$.

Complexidade: $O(ND)$ em tempo e $O(N+M)$ em memória. Com alterações moderadas ($D \ll N$), conclui em milissegundos.

# 2. Salvaguardas: Exploração Delimitada e Ancoragem

Em textos divergentes ($D \approx N+M$), o pior caso atinge $O(N^2)$. O ToolsAA aplica três salvaguardas para manter 60 FPS:

1. Poda Linear ($O(K)$): Remove linhas idênticas nas extremidades antes do grafo.
2. Profundidade Delimitada: Com $N \cdot M > 300.000$, limita a busca a $D_{\max} = 400$.
3. Ancoragem Heurística ($O(N+M)$): Tabela hash que vincula blocos comuns em janelas de 60 linhas.

# 3. Tokenização Multi-Nível e Web APIs Nativas

• Linha: Divisão por \n, idônea para código-fonte.
• Palavra: RegEx Unicode (\p{L}\p{N}_) que isola termos preservando acentuação em português.
• Caractere: Array.from() decompõe pares substitutos UTF-16, preservando emojis.
• Web APIs: FileReader para leitura local sem rede, Int32Array para evitar recoleção de lixo e useDeferredValue do React 18 para fluidez de interface.

# 4. Padrões POSIX e Patch Unificado do Git

Gera patches conformes a POSIX.1-2008 e Git. No cabeçalho @@ -l,s +l,s @@, $l$ e $s$ definem início e extensão nos arquivos base e modificado, com 3 linhas de contexto para que git apply aplique alterações com exatidão.

# Guia Prático Passo a Passo de Utilização

# Passo 1: Inserção de Dados

• Colar Conteúdo: Insira o texto base à esquerda e o modificado à direita.
• Carregar Arquivos: Use Upload de Arquivo para importar arquivos locais via FileReader nativo, sem rede.
• Modelos Prontos: Presets de TypeScript, JSON, SQL ou texto editorial para testes.

# Passo 2: Seleção do Modo de Visualização

• Visão Dividida (Split View): Colunas sincronizadas com remoções em vermelho e adições em verde.
• Visão Unificada (Unified View): Linhas mescladas em fluxo contínuo com prefixos + e -, idêntico a git diff.

# Passo 3: Configuração de Granularidade e Normalização

• Granularidade: Palavra para análise semântica, Linha para código, ou Caractere para hashes.
• Espaços: Preservar Tudo para indentação, Apenas Extremidades (Trim) para ignorar margens, ou Ignorar Tudo para foco textual.
• Maiúsculas/Minúsculas: Marque Ignorar Caixa para consultas SQL ou buscas insensíveis a maiúsculas.

# Passo 4: Navegação e Exportação de Resultados

• Navegador: Alterne entre blocos modificados com os botões Anterior e Próximo.
• Exportar: Copie o patch unificado ou baixe arquivos .diff ou .patch para pipelines de CI/CD.

# Implementações de Código em Produção

# 1. Implementação em TypeScript Moderno

Algoritmo de Myers e gerador de patches unificados otimizado para navegador e Node.js:

export type DiffOp = "equal" | "delete" | "insert";
export interface DiffItem { op: DiffOp; val: string; }

// Algoritmo de Eugene Myers O(ND) com Int32Array
export function myersDiff(a: string[], b: string[]): DiffItem[] {
  const n = a.length, m = b.length, max = n + m;
  const v = new Int32Array(2 * max + 1);
  const trace: Int32Array[] = [];

  for (let d = 0; d <= max; d++) {
    trace.push(new Int32Array(v));
    for (let k = -d; k <= d; k += 2) {
      let x = (k === -d || (k !== d && v[k - 1 + max] < v[k + 1 + max]))
        ? v[k + 1 + max] : v[k - 1 + max] + 1;
      let y = x - k;
      while (x < n && y < m && a[x] === b[y]) { x++; y++; }
      v[k + max] = x;
      if (x >= n && y >= m) { d = max + 1; break; }
    }
  }

  // Reconstrução do caminho ótimo via backtracking
  let x = n, y = m;
  const diff: DiffItem[] = [];
  for (let d = trace.length - 1; d >= 0; d--) {
    const vP = trace[d], k = x - y;
    const prevK = (k === -d || (k !== d && vP[k - 1 + max] < vP[k + 1 + max])) ? k + 1 : k - 1;
    const px = vP[prevK + max], py = px - prevK;
    while (x > px && y > py) { x--; y--; diff.push({ op: "equal", val: a[x] }); }
    if (d > 0) {
      if (x === px) { y--; diff.push({ op: "insert", val: b[y] }); }
      else { x--; diff.push({ op: "delete", val: a[x] }); }
    }
    x = px; y = py;
  }
  return diff.reverse();
}

// Formatação de patch unificado compatível com POSIX/Git
export function toPatch(diff: DiffItem[], nameA = "a.txt", nameB = "b.txt"): string {
  let patch = `--- ${nameA}\n+++ ${nameB}\n@@ -1,${diff.length} +1,${diff.length} @@\n`;
  for (const item of diff) {
    const pfx = item.op === "equal" ? " " : item.op === "delete" ? "-" : "+";
    patch += `${pfx}${item.val}\n`;
  }
  return patch;
}

# 2. Implementação em Python 3.11+

Implementação idiomática em Python moderno com tipagem estática:

from typing import List, Tuple

def myers_diff(a: List[str], b: List[str]) -> List[Tuple[str, str]]:
    """Calcula a sequência ótima de edições utilizando o algoritmo O(ND) de Myers."""
    n, m = len(a), len(b)
    max_d = n + m
    v = {1: 0}
    trace = []

    for d in range(max_d + 1):
        trace.append(v.copy())
        for k in range(-d, d + 1, 2):
            x = v[k + 1] if (k == -d or (k != d and v.get(k - 1, 0) < v.get(k + 1, 0))) else v.get(k - 1, 0) + 1
            y = x - k
            while x < n and y < m and a[x] == b[y]:
                x += 1; y += 1
            v[k] = x
            if x >= n and y >= m:
                break
        if v.get(n - m, 0) >= n:
            break

    # Reconstrução da sequência ótima via backtracking
    x, y = n, m
    diff = []
    for d in range(len(trace) - 1, -1, -1):
        v_p = trace[d]
        k = x - y
        prev_k = k + 1 if (k == -d or (k != d and v_p.get(k - 1, 0) < v_p.get(k + 1, 0))) else k - 1
        px = v_p.get(prev_k, 0)
        py = px - prev_k
        while x > px and y > py:
            x -= 1; y -= 1
            diff.append(("equal", a[x]))
        if d > 0:
            if x == px:
                y -= 1; diff.append(("insert", b[y]))
            else:
                x -= 1; diff.append(("delete", a[x]))
        x, y = px, py

    return list(reversed(diff))

def format_patch(diff: List[Tuple[str, str]], file_a="a.txt", file_b="b.txt") -> str:
    """Gera um patch unificado compatível com git apply e utilitário patch."""
    lines = [f"--- {file_a}", f"+++ {file_b}", f"@@ -1,{len(diff)} +1,{len(diff)} @@"]
    for op, val in diff:
        pfx = " " if op == "equal" else ("-" if op == "delete" else "+")
        lines.append(f"{pfx}{val}")
    return "\n".join(lines) + "\n"

# Erros Comuns, Casos Limite e Solução de Problemas

# 1. Inconsistência de Quebras de Linha (CRLF vs. LF)

• Problema: Arquivos idênticos entre Windows e Linux aparecem modificados por divergências entre \r\n e \n.
• Solução: O ToolsAA converte CRLF em LF (.replace(/\r\n/g, "\n")) antes do grafo.

# 2. Normalização Unicode: NFC vs. NFD

• Problema: Acentos em português diferem entre macOS (NFD) e Linux/Windows (NFC), gerando falsas diferenças.
• Solução: Normalize entradas com String.prototype.normalize('NFC') antes da tokenização.

# 3. Caracteres Invisíveis de Largura Zero e Trojans BiDi

• Problema: Linhas visualmente iguais diferem por espaços de largura zero (U+200B), marcas BOM (U+FEFF) ou códigos BiDi (U+202E).
• Solução: O motor destaca caracteres não imprimíveis com selos gráficos explícitos ([ZWSP], [BOM]).

# 4. Chaves Fora de Ordem em Objetos JSON

• Problema: JSONs equivalentes reportam alterações massivas pela ordem arbitrária de propriedades.
• Solução: Ordene chaves recursivamente com Object.keys().sort() antes de comparar.

# 5. Sobrecarga de Memória em Arquivos Minificados Monolinha

• Problema: Arquivos de linha única com milhares de caracteres sobrecarregam CPU e DOM.
• Solução: O motor limita a tokenização intra-linha a 5.000 caracteres e delega o processamento ao useDeferredValue.

# Perguntas Frequentes (FAQ)

# Q1: Como o ToolsAA garante a privacidade de código e credenciais?

Resposta: Opera 100% no navegador ("use client"). Todo o processamento algorítmico ocorre na memória local sem requisições remotas ou telemetria, em conformidade com a LGPD e GDPR.

# Q2: Em que o algoritmo de Myers difere da programação dinâmica clássica de LCS?

Resposta: A programação clássica avalia uma matriz $N \times M$ em $O(NM)$. Myers percorre diagonais com custo zero em correspondências, atingindo $O(ND)$ quando as diferenças $D$ são pequenas ($D \ll N$).

# Q3: Por que o comparador aponta todo o arquivo como alterado se o texto parece igual?

Resposta: Ocorre por discrepâncias de fim de linha entre Windows (\r\n) e Unix (\n). Ative Apenas Extremidades (Trim) ou use a normalização automática do ToolsAA para LF.

# Q4: É possível comparar arquivos JavaScript minificados ou JSON em linha única?

Resposta: Sim. Defina a Granularidade como Palavra ou Caractere. O motor fragmenta o texto em tokens léxicos, isolando mudanças sem depender de quebras de linha.

# Q5: Como se interpretam as coordenadas nas cabeçalhas de um patch unificado?

Resposta: Em @@ -l,s +l,s @@, -l,s define linha inicial e extensão no arquivo original, e +l,s no modificado. Utilitários como git apply usam essas coordenadas para aplicar alterações sem desvios.

# Q6: Qual nível de granularidade é recomendado para código em contraste com prosa?

Resposta: Utilize Palavra com Preservar Espaços para código; Palavra com Apenas Extremidades para documentação; e Caractere para hashes e chaves criptográficas.

# Q7: Como o ToolsAA evita travamentos de interface em arquivos grandes?

Resposta: Aplica poda linear prévia, busca limitada a $D_{\max}=400$ com ancoragem heurística, arrays tipados Int32Array e useDeferredValue do React 18.

# Q8: Como aplicar um patch gerado diretamente no terminal?

Resposta: Salve o conteúdo como .patch e aplique-o no terminal com ferramentas padrão:

git apply --ignore-whitespace alteracoes.patch
patch -p1 < alteracoes.patch

# Matriz Comparativa: Modos, Granularidades e Casos de Uso

# Conclusão

O Comparador de Diferenças de Texto e Código do ToolsAA une a precisão matemática do algoritmo de Eugene Myers à privacidade absoluta no cliente. Com execução 100% no navegador, entrega velocidade instantânea sem transferir código confidencial ou credenciais a servidores remotos.

Ao auditar pull requests, manifestos ou contratos, conte com uma ferramenta precisa para comparar texto online e comparar código com soberania total de dados e exatidão algorítmica.