# Comparateur de texte et de code en ligne : Architecture technique et guide pratique

La comparaison de texte, de schémas et de code source est essentielle en génie logiciel, DevOps et audit technique. Pour analyser une pull request, corriger une dérive de configuration (configuration drift) ou valider des contrats, exactitude et rapidité sont décisives.

Le comparateur de texte et de code ToolsAA est un outil web exécuté 100 % dans le navigateur. Il intègre un diff checker en ligne, un visualiseur côte à côte (side-by-side) et un générateur de patchs Git et POSIX. Bâti selon une architecture zero-knowledge, tous les calculs s'exécutent côté client sans serveurs externes ni télémétrie. Ce guide détaille l'algorithme de Myers, l'architecture in-browser, des implémentations TypeScript et Python, et la gestion des cas limites.

# Présentation générale et cas d'usage en production

Les comparateurs calculent les transformations minimales pour convertir un document source en document révisé, isolant ajouts, suppressions et ajustements intra-lignes au point de code près (code point).

[ Document original (A) ]                      [ Document modifié (B) ]
          \                                               /
           v                                             v
+---------------------------------------------------------------+
|         Moteur de comparaison diff in-browser ToolsAA         |
|  - Zéro télémétrie réseau (Évaluation 100 % côté client)      |
|  - Normalisation (CRLF -> LF, Unicode NFC, Espaces)           |
|  - Parcours du graphe d'édition O(ND) d'Eugene Myers          |
|  - Tokenisation intra-ligne précise (RegEx \p{L}\p{N})        |
+---------------------------------------------------------------+
                |                               |
                v                               v
    [ Vue côte à côte (Split) ]     [ Patch unifié (POSIX / Git) ]

# Cas d'usage clés en ingénierie

• Commits et revues de code : Isole identifiants renommés et mutations logiques sans alterner de branche.
• Audits IaC : Comparez manifests Kubernetes, Terraform et Docker Compose en protégeant vos secrets.
• Migrations SQL : Auditez schémas DDL et plans EXPLAIN pour vérifier index et filtres.
• Payloads JSON : Détectez suppressions et altérations de types dans les flux REST et GraphQL.
• Contrats et juridique : Comparez accords NDA et clauses, en isolant les révisions contractuelles.

# Confidentialité absolue côté client

De nombreux comparateurs transmettent vos données à des serveurs distants, exposant vos clés dans des logs tiers. ToolsAA applique un modèle zéro serveur : pour comparer deux fichiers texte en ligne, tokenisation, calcul et rendu s'opèrent dans la mémoire locale du navigateur. Aucun octet ne transite sur le réseau.

# Architecture technique et fonctionnement interne

Le calcul de différences moderne résout le problème de la plus longue sous-séquence commune (Longest Common Subsequence, LCS), dual de la séquence d'édition la plus courte (Shortest Edit Script, SES).

# 1. L'algorithme O(ND) d'Eugene Myers

Git utilise l'algorithme d'Eugene Myers (1986). Pour deux séquences $A$ ($N$) et $B$ ($M$), Myers modélise le problème sur un graphe d'édition (edit graph) de grille $(N+1) \times (M+1)$ :

• Pas horizontal $(x, y) \to (x+1, y)$ : Suppression de $A[x+1]$ (coût 1).
• Pas vertical $(x, y) \to (x, y+1)$ : Insertion de $B[y+1]$ (coût 1).
• Pas diagonal $(x, y) \to (x+1, y+1)$ : Coïncidence exacte $A[x+1] == B[y+1]$ (coût 0).

Il cherche le chemin optimal de $(0,0)$ à $(N,M)$ en minimisant $D$ :

• Diagonales : $k = x - y$, avec $k \in [-M, N]$.
• Plus grande portée : Le vecteur $V$ mémorise le plus grand $x$ : $x = \max(V[k-1] + 1, V[k+1])$.
• Avance gloutonne (snakes) : Progression sans coût tant que $A[x+1] == B[y+1]$.

Complexité : $O(ND)$ en temps et $O(N+M)$ en mémoire ; pour des changements modérés ($D \ll N$), le calcul prend quelques millisecondes.

# 2. Garde-fous algorithmiques

Sur des textes très divergents ($D \approx N+M$), la complexité tend vers $O(N^2)$. ToolsAA intègre trois garde-fous :

1. Élagage linéaire ($O(K)$) : Élimine les lignes identiques aux extrémités.
2. Profondeur bornée : Avec $N \cdot M > 300\,000$, la recherche est limitée à $D_{\max} = 400$.
3. Ancrage heuristique ($O(N+M)$) : Table de hachage reliant les blocs communs sur 60 lignes.

# 3. Tokenisation multi-niveaux et API Web natives

• Ligne : Découpage par \n, adapté au code source.
• Mot : RegEx Unicode (\p{L}\p{N}_) préservant accents et symboles.
• Caractère : Array.from() gérant paires UTF-16 et émojis.
• API Web : FileReader local, Int32Array limitant le ramasse-miettes et useDeferredValue de React 18 pour fluidifier le rendu.

# 4. Norme POSIX et spécification de patch unifié

Génère des patchs conformes à POSIX.1-2008 et Git. Dans l'en-tête @@ -l,s +l,s @@, -l,s et +l,s indiquent ligne de départ et longueur dans chaque fichier avec 3 lignes de contexte pour git apply.

# Guide pratique étape par étape

# Étape 1 : Saisie et chargement des données

• Coller du texte : Insérez l'original à gauche et le révisé à droite.
• Charger des fichiers : Ouvrez vos fichiers locaux via FileReader, sans transit réseau.
• Modèles intégrés : Préréglages TypeScript, JSON, SQL ou texte pour tester l'outil.

# Étape 2 : Sélection du mode d'affichage

• Vue côte à côte (Split View) : Colonnes synchronisées avec suppressions en rouge et ajouts en vert.
• Vue unifiée (Unified View) : Flux vertical avec marqueurs + et -, identique à git diff.

# Étape 3 : Configuration de la granularité et normalisation

• Granularité : Mot pour le niveau lexical, Ligne pour les blocs, ou Caractère pour les hashes.
• Espaces : Conserver tout pour l'indentation, Rogner pour les marges, ou Ignorer tout.
• Casse : Activez Ignorer la casse pour les requêtes SQL insensibles à la casse.

# Étape 4 : Navigation et export des résultats

• Navigateur : Parcourez les blocs modifiés avec Précédent et Suivant.
• Exporter : Copiez le patch unifié ou téléchargez le fichier .patch ou .diff.

# Implémentations de code prêtes pour la production

# 1. Implémentation en TypeScript moderne

Algorithme de Myers complet et formateur de patch unifié pour navigateur et Node.js :

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

// Algorithme O(ND) d'Eugene Myers en TypeScript
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; }
    }
  }

  // Reconstruction du chemin d'édition minimal (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();
}

// Formatage au standard unifié 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. Implémentation robuste en Python 3.11+

Implémentation typée de l'algorithme de Myers en Python avec export de patch formaté :

from typing import List, Tuple

def myers_diff(a: List[str], b: List[str]) -> List[Tuple[str, str]]:
    # Calcule la séquence minimale d'édition selon 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

    # Reconstruction du script d'édition optimal
    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: str = "a.txt", file_b: str = "b.txt") -> str:
    # Génère un patch unifié compatible POSIX
    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"

# Erreurs courantes, cas limites et guide de dépannage

# 1. Incohérences de sauts de ligne (CRLF vs LF)

• Problème : Fichiers identiques entre Windows et Linux marqués modifiés par écarts entre \r\n et \n.
• Solution : ToolsAA harmonise CRLF en LF (.replace(/\r\n/g, "\n")) avant calcul.

# 2. Normalisation Unicode : Formes NFC vs NFD

• Problème : Accents divergents entre macOS (NFD) et Linux/Windows (NFC), générant des faux positifs.
• Solution : Appliquez String.prototype.normalize('NFC') avant tokenisation.

# 3. Caractères invisibles et chevaux de Troie BiDi

• Problème : Lignes identiques signalées modifiées par espaces sans chasse (U+200B), BOM (U+FEFF) ou inversions (U+202E).
• Solution : Le moteur affiche des badges explicites ([ZWSP], [BOM]) sur les glyphes non imprimables.

# 4. Clés non ordonnées dans les objets JSON

• Problème : Payloads JSON équivalents signalant des modifications à cause de l'ordre des clés.
• Solution : Triez récursivement les clés d'objets avec Object.keys().sort().

# 5. Fichiers minifiés sur une ligne continue

• Problème : Bundles minifiés volumineux sur une seule ligne saturant l'analyse lexicale.
• Solution : ToolsAA limite la segmentation à 5 000 caractères par ligne et délègue le rendu via useDeferredValue.

# Foire aux questions technique (FAQ)

# Q1 : Comment ToolsAA garantit-il la confidentialité de mon code ?

Réponse : L'outil s'exécute à 100 % dans le navigateur ("use client"). Algorithme, normalisation et patchs opèrent en mémoire locale sans requêtes réseau ni télémétrie.

# Q2 : En quoi l'algorithme de Myers diffère-t-il de la programmation dynamique de la LCS ?

Réponse : La programmation classique évalue une matrice $N \times M$ en $O(NM)$. Myers parcourt les diagonales à coût nul sur les correspondances, atteignant $O(ND)$ quand $D \ll N$.

# Q3 : Pourquoi le comparateur surligne-t-il tout le fichier si les textes semblent identiques ?

Réponse : Cela provient d'écarts de fin de ligne entre Windows (\r\n) et Unix (\n). Activez Rogner les espaces ou la normalisation automatique en LF.

# Q4 : Est-il possible de comparer des fichiers minifiés ou du JSON sur une ligne ?

Réponse : Oui. Réglez la Granularité sur Mot ou Caractère. Le moteur fragmente la ligne en jetons, isolant les modifications sans retours à la ligne.

# Q5 : Comment interpréter les coordonnées dans l'en-tête d'un patch unifié ?

Réponse : Dans @@ -l,s +l,s @@, -l,s indique début et longueur dans le fichier source, et +l,s dans le révisé. git apply s'en sert pour positionner les blocs.

# Q6 : Quel niveau de granularité convient selon le contenu ?

Réponse : Utilisez Mot avec Conserver tout pour le code ; Mot avec Rogner pour la prose ; et Caractère pour les hashes et clés.

# Q7 : Comment ToolsAA évite-t-il les blocages sur de gros fichiers ?

Réponse : Par élagage linéaire, profondeur bornée ($D_{\max}=400$) avec ancrage heuristique, tableaux Int32Array et le hook React 18 useDeferredValue.

# Q8 : Comment appliquer en terminal un patch généré par l'outil ?

Réponse : Enregistrez le correctif au format .patch et exécutez dans votre terminal :

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

# Matrice comparative technique : Modes et granularités

# Conclusion et bonnes pratiques

Le comparateur de texte et de code ToolsAA allie rigueur algorithmique, exécution in-browser instantanée et souveraineté absolue sur vos données. Grâce à l'algorithme $O(ND)$ d'Eugene Myers dans le navigateur, vous bénéficiez de performances natives sans transférer de code propriétaire à des serveurs tiers.

Qu'il s'agisse d'auditer des pull requests, de valider des manifests ou d'inspecter des API, profitez d'une solution fiable pour comparer du texte et du code en ligne avec exactitude mathématique et confidentialité totale.