Vue d'ensemble
Une plateforme de quiz multijoueur en temps réel de qualité production construite sur une architecture multi-tenant, conçue pour gérer 100+ utilisateurs simultanés répartis sur plusieurs salles de jeu en parallèle. Deux sites de production sont actuellement en ligne :- PistolQuiz (culture générale : culture, science, histoire, sport)
- FreestyleQuiz (trivia freestyle football : battles, événements, champions, légendes)
Architecture de Production
Scalabilité & Performance
Le système est conçu pour des charges de production avec un accent sur la communication temps réel à faible latence et haute concurrence :- Socket.IO WebSockets avec une livraison des événements en moins de 100ms à tous les clients connectés
- Moteur de jeu événementiel traitant les événements de buzz, les soumissions de réponses et les transitions d'état sans aucune I/O bloquante
- État de jeu en mémoire pour des lectures/écritures instantanées (aucun aller-retour base de données pendant le gameplay)
- Isolation par salle garantissant une logique de jeu indépendante, permettant 20+ salles simultanées
- Arrêt gracieux avec nettoyage complet des timers, déconnexion des sockets et persistance de l'état
Infrastructure
| Composant | Technologie | Rôle |
|---|---|---|
| CDN Frontend | Vercel + Cloudflare | Cache en edge global, terminaison SSL, protection DDoS |
| Backend | Hetzner VPS (Node.js) | Serveur WebSocket, moteur de jeu, auth JWT |
| Gestionnaire de Processus | PM2 | Redémarrage automatique, gestion des logs, rechargement sans interruption |
| CI/CD | GitHub Actions | Pipeline automatisé de lint, vérification de types, build et tests |
| Monitoring | Endpoint /stats personnalisé | Nombre de salles, de joueurs et utilisation mémoire en temps réel |
Sécurité
- Authentification JWT avec tokens scopés par salle et élévation de privilèges hôte
- Autorité d'état côté serveur empêchant toute altération côté client (scores, réponses, timers entièrement gérés par le serveur)
- Données spectateur nettoyées supprimant tous les champs de réponse avant diffusion aux spectateurs
- Rate limiting sur tous les événements socket avec throttling basé sur l'IP
- Validation des entrées avec sanitisation XSS via DOMPurify sur toutes les saisies utilisateur
- Liste blanche CORS par site avec validation d'origine
Architecture Multi-Tenant
Un seul codebase dessert plusieurs marques de quiz avec une isolation complète :- Résolution du site via l'Origin HTTP ou le header X-Site-ID sur chaque requête
- Configuration par site : timers, catégories, thèmes, branding, métadonnées SEO, images OG
- Logique de jeu partagée avec répertoires de données spécifiques par site (questions, assets)
- Pipeline d'assets dynamique : le script prebuild génère un index.html spécifique au site et copie les assets de marque
Fonctionnalités Temps Réel
- Résilience à la reconnexion : période de grâce de 30s avec timers de forfait annulables, reconnexion automatique avec backoff exponentiel
- Correspondance floue des réponses : distance de Levenshtein + similarité de Jaro-Winkler avec seuils adaptatifs basés sur la longueur de la réponse
- Mode spectateur en direct : visionnage du jeu en temps réel avec sanitisation des réponses côté serveur
- Support bilingue : i18n complète français/anglais avec 346 clés de traduction
Stack Technique
| Couche | Technologies |
|---|---|
| Frontend | React 18, TypeScript, Vite, Tailwind CSS, Framer Motion, Zustand, i18next |
| Backend | Node.js, Express, Socket.IO, JWT, Zod |
| Infrastructure | Vercel, Cloudflare, Hetzner VPS, PM2, Docker |
| CI/CD | GitHub Actions (lint, build, test) |
| Tests | Jest (unitaires), Playwright (E2E) |
| Sécurité | Helmet, CORS, DOMPurify, rate limiting, JWT |