Développement
Article populaire

WebRTC en production : Téléconsultation vidéo à grande échelle

Équipe Wapiki
25 Janvier 2026
12 min de lecture
WebRTCVidéoReact NativePerformanceMobile

Le défi de la vidéo en Afrique

Déployer une solution de téléconsultation vidéo en Afrique présente des défis uniques : connexion 3G instable, latence élevée, et coût de la data.

Pour Keneya, nous avons dû optimiser chaque aspect de notre stack WebRTC.

Architecture WebRTC optimisée

1. Serveur TURN/STUN optimisé

typescript
const configuration: RTCConfiguration = {
  iceServers: [
    { urls: 'stun:stun.wapiki.com:3478' },
    {
      urls: 'turn:turn.wapiki.com:3478',
      username: 'keneya',
      credential: 'secure_token'
    }
  ],
  bundlePolicy: 'max-bundle',
  rtcpMuxPolicy: 'require',
  iceCandidatePoolSize: 10
}

2. Adaptation dynamique de la qualité

Notre algorithme détecte la qualité réseau et ajuste automatiquement :

  • **Excellente connexion (4G+)** : 720p, 30fps
  • **Bonne connexion (3G+)** : 480p, 24fps
  • **Connexion faible (3G)** : 360p, 15fps
  • **Très faible** : Audio seulement
  • typescript
    async function adaptVideoQuality(stats: RTCStatsReport) {
      const bandwidth = calculateBandwidth(stats)
    
      if (bandwidth < 500) {
        // Passer en audio seulement
        await disableVideo()
      } else if (bandwidth < 1000) {
        // 360p, 15fps
        await setVideoConstraints({ width: 640, height: 360, frameRate: 15 })
      } else if (bandwidth < 2000) {
        // 480p, 24fps
        await setVideoConstraints({ width: 854, height: 480, frameRate: 24 })
      } else {
        // 720p, 30fps
        await setVideoConstraints({ width: 1280, height: 720, frameRate: 30 })
      }
    }

    3. Optimisation mobile (React Native)

    Sur React Native, nous utilisons react-native-webrtc avec des optimisations spécifiques :

  • Codec **VP8** pour compatibilité maximale
  • **Hardware acceleration** sur Android/iOS
  • **Automatic echo cancellation**
  • **Background mode** pour iOS
  • Gestion de la reconnexion

    Les coupures réseau sont fréquentes. Notre système reconnecte automatiquement :

    typescript
    peerConnection.oniceconnectionstatechange = async () => {
      if (peerConnection.iceConnectionState === 'disconnected') {
        // Tentative de reconnexion ICE
        await restartIce()
      } else if (peerConnection.iceConnectionState === 'failed') {
        // Recréer la connexion complète
        await recreatePeerConnection()
      }
    }

    Résultats en production

  • 📊 **25,000+ consultations** vidéo réalisées
  • ⚡ **Latence moyenne** : 280ms
  • 📱 **Taux de succès** : 94% sur 3G
  • 🔄 **Reconnexion automatique** : <3 secondes
  • Conclusion

    WebRTC en Afrique est possible, mais nécessite une optimisation agressive et une compréhension profonde des contraintes réseau.


    *Vous développez une solution de vidéo en temps réel ? [Parlons-en](/contact).*

    Cet article vous a plu ?

    Partagez-le avec votre réseau !