Créer une App Moderne — Avalonia UI & .NET

⚡ Module 8 — Le temps réel avec WebSockets

Afficher les ajouts instantanément chez tous les utilisateurs connectés.

Créer une App Moderne — Avalonia UI & .NET

📝 Changelog

  • Passage d'un mode requête/réponse à un mode événementiel.
  • Création d'un repository temps réel.
  • Introduction de Dispatcher.UIThread pour sécuriser le rendu.
Créer une App Moderne — Avalonia UI & .NET

Objectif du module

  • Recevoir les mises à jour poussées par le serveur.
  • Diffuser les ajouts à tous les clients.
  • Mettre à jour la liste sans polling.
  • Comprendre le modèle Push vs Pull.
Créer une App Moderne — Avalonia UI & .NET

REST ne suffit plus

  • REST synchronise sur demande.
  • Le temps réel exige une connexion durable.
  • Le serveur signale lui-même qu'une donnée change.
  • L'expérience utilisateur devient collaborative.
Créer une App Moderne — Avalonia UI & .NET

Le concept clé: programmation événementielle

  • Un message entrant déclenche une réaction.
  • Le réseau travaille sur un thread différent.
  • L'UI doit être mise à jour sur le thread graphique.
  • Dispatcher.UIThread.Post(...) évite les erreurs d'accès concurrent.
Créer une App Moderne — Avalonia UI & .NET

Vue métier du temps réel

Flux WebSocket entre deux clients et le serveur temps réel

Créer une App Moderne — Avalonia UI & .NET

Diffusion Mermaid multi-clients

Client A envoie une tache, le serveur diffuse l'evenement, puis Client B rafraichit son interface.

Diffusion WebSocket entre plusieurs clients

Créer une App Moderne — Avalonia UI & .NET

Squelette côté client

await foreach (var message in _socketClient.ListenAsync())
{
    Dispatcher.UIThread.Post(() =>
    {
        Taches.Add(message.ToTodoItem());
    });
}
Créer une App Moderne — Avalonia UI & .NET

Problèmes réels à discuter

  • Reconnexion automatique.
  • Gestion des doublons de messages.
  • Ordonnancement des événements.
  • Conflits si plusieurs utilisateurs modifient la même tâche.
Créer une App Moderne — Avalonia UI & .NET

Livrable du module

  • Deux clients affichent la même liste.
  • Un ajout sur A apparaît sur B.
  • L'équipe comprend la différence entre HTTP et WebSocket.