La stack de l'interface — explication

De quoi s'agit-il ?

Le draft demande une application de bureau en Go avec Wails, « sobre et fancy », organisée en panels comme l'éditeur Zed. Wails dessine l'interface avec des technologies web dans une fenêtre native ; la question était donc de choisir les briques web. La décision et ses mesures sont dans l'ADR 0002 (en anglais).

Pourquoi Wails v3

Wails v3 est devenu stable le 26 octobre 2026, après presque quatre ans d'alpha et de bêta. Son modèle colle à Sidekicks : le côté Go est fait de services (agents, channels, terminal), les messages vers l'interface sont des événements typés, plusieurs fenêtres sont possibles, et le packaging macOS (signature, DMG, mises à jour) est intégré. Démarrer sur la v2 voudrait dire migrer dans quelques mois.

Pourquoi Svelte et ces composants

L'interface est mise à jour de nombreuses fois par seconde pendant qu'un agent répond. Svelte 5 compile en mises à jour directes du DOM, sans DOM virtuel, et Wails fournit un template officiel. Autour, chaque besoin a son composant reconnu : paneforge pour les panels redimensionnables, markdown-it et Shiki pour le Markdown avec une coloration de code digne de VS Code, DOMPurify pour que le HTML écrit par un modèle ne s'exécute jamais, Asciidoctor.js (chargé seulement quand un fichier AsciiDoc est prévisualisé) pour l'AsciiDoc, CodeMirror 6 pour l'éditeur YAML, xterm.js et un vrai PTY pour le terminal.

Le prototype

Ce que le prototype a montré

Un prototype a assemblé toutes ces briques dans une fenêtre. Le point décisif était le streaming : afficher le Markdown au plus une fois par rafraîchissement de l'écran, plutôt qu'à chaque fragment, garde l'interface fluide même à 500 fragments par seconde, et un bloc de code encore en cours d'écriture est déjà coloré.

Alternatives écartées

Monaco (l'éditeur de VS Code) est complet mais lourd pour éditer un seul fichier YAML.
highlight.js est plus léger que Shiki mais sa coloration est nettement moins bonne.
React ou Vue fonctionneraient ; rien dans Sidekicks n'a besoin de leurs écosystèmes.

Lien avec le reste

L'interface ne parle qu'à un seul package Go, internal/app (voir Architecture). Les écrans qu'elle affichera sont dessinés dans les maquettes. Une vérification reste ouverte : lancer le prototype sur macOS, ce que la sandbox de développement ne permet pas.

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29


# La stack de l'interface — explication

## De quoi s'agit-il ?

Le draft demande une application de bureau en Go avec [Wails](https://wails.io), « sobre et fancy », organisée en panels comme l'éditeur Zed. Wails dessine l'interface avec des technologies web dans une fenêtre native ; la question était donc de choisir les briques web. La décision et ses mesures sont dans l'[ADR 0002](../../adr/0002-ui-stack.md) (en anglais).

## Pourquoi Wails v3

Wails v3 est devenu stable le 26 octobre 2026, après presque quatre ans d'alpha et de bêta. Son modèle colle à Sidekicks : le côté Go est fait de **services** (agents, channels, terminal), les messages vers l'interface sont des **événements typés**, plusieurs fenêtres sont possibles, et le packaging macOS (signature, DMG, mises à jour) est intégré. Démarrer sur la v2 voudrait dire migrer dans quelques mois.

## Pourquoi Svelte et ces composants

L'interface est mise à jour de nombreuses fois par seconde pendant qu'un agent répond. Svelte 5 compile en mises à jour directes du DOM, sans DOM virtuel, et Wails fournit un template officiel. Autour, chaque besoin a son composant reconnu : paneforge pour les panels redimensionnables, markdown-it et Shiki pour le Markdown avec une coloration de code digne de VS Code, DOMPurify pour que le HTML écrit par un modèle ne s'exécute jamais, Asciidoctor.js (chargé seulement quand un fichier AsciiDoc est prévisualisé) pour l'AsciiDoc, CodeMirror 6 pour l'éditeur YAML, xterm.js et un vrai PTY pour le terminal.

![Le prototype](../../spikes/ui/prototype-linux.png)

## Ce que le prototype a montré

Un prototype a assemblé toutes ces briques dans une fenêtre. Le point décisif était le streaming : afficher le Markdown au plus une fois par rafraîchissement de l'écran, plutôt qu'à chaque fragment, garde l'interface fluide même à 500 fragments par seconde, et un bloc de code encore en cours d'écriture est déjà coloré.

## Alternatives écartées

- **Monaco** (l'éditeur de VS Code) est complet mais lourd pour éditer un seul fichier YAML.
- **highlight.js** est plus léger que Shiki mais sa coloration est nettement moins bonne.
- **React ou Vue** fonctionneraient ; rien dans Sidekicks n'a besoin de leurs écosystèmes.

## Lien avec le reste

L'interface ne parle qu'à un seul package Go, `internal/app` (voir [Architecture](architecture.md)). Les écrans qu'elle affichera sont dessinés dans les [maquettes](../../design/README.md). Une vérification reste ouverte : lancer le prototype sur macOS, ce que la sandbox de développement ne permet pas.