Moteur Vidéo & Streaming

Le dashboard FirstBreath est unique car il doit afficher de la vidéo en direct avec une Latence Inférieure à la Seconde dans un environnement navigateur.

Le Gestionnaire de Protocole (useProtocolManager)

Nous ne comptons pas sur un seul protocole de streaming. Au lieu de cela, nous utilisons une stratégie de repli intelligente pour assurer que la vidéo joue toujours, dégradant la latence si nécessaire.

Ordre de Priorité

1. MSE (Media Source Extensions) - Préféré

   • Latence : ~300ms
   • Transport : Websockets (Binary Blob)
   • Pour : Latence la plus basse possible sans la complexité WebRTC.
   • Contre : Utilisation CPU élevée sur le client.

2. WebRTC

   • Latence : ~500ms
   • Transport : UDP/TCP
   • Pour : Standard pour le temps réel.
   • Contre : Traversée de pare-feu complexe (ICE/STUN/TURN).

3. HLS-LL (Low Latency HLS)

   • Latence : ~2-4s
   • Transport : HTTP (Chunks)
   • Pour : Bon équilibre.

4. HLS (Standard) - Dernier Recours

   • Latence : ~10s+
   • Pour : Fonctionne partout (même sur une mauvaise 3G).
   • Contre : Délai élevé, inutile pour l'intervention temps réel.

Implémentation

Le hook useProtocolManager tente de se connecter en utilisant le protocole de plus haute priorité disponible. Si le flux échoue ou cale pour > 500ms, il déclenche une bascule vers le prochain protocole disponible.

const { currentProtocol } = useProtocolManager({
  preferredProtocol: "mse",
  onProtocolChange: (p) => console.log("Bascule vers", p),
});

Gestionnaire de Socket (useSocketManager)

Nous utilisons un pattern singleton pour gérer plusieurs connexions Socket.io (une par flux caméra si utilisation de MSE, plus une pour les événements globaux de l'app).

• Pooling de Connexion : Stocke les sockets dans une Map<string, Socket>.
• Auto-Auth : Injecte automatiquement le JWT depuis tokenManager dans l'objet auth du handshake.
• Garbage Collection : Déconnecte automatiquement les sockets inutilisés depuis 5 minutes pour économiser les ressources backend.