DASHBOARD FINANCE & MÉTÉO
Interface data-intensive avec système de cache Redis pour des performances optimales face aux API bridées.
Contexte
Création d'un tableau de bord affichant des données complexes en temps réel. Le défi n'était pas le volume de données, mais la vitesse de distribution et le contournement des limites de taux (rate-limits) des API externes gratuites.
Méthodologie d'Apprentissage
- 1
Développement d'un backend Node.js servant de proxy/buffer entre le front et l'API externe
- 2
Intégration de Redis In-Memory pour stocker les réponses de l'API externe
- 3
Logique de Cache Hit/Miss : Interrogation de Redis d'abord ; si vide, appel de l'API puis stockage avec un TTL (Time To Live)
- 4
Création d'un frontend React/TypeScript utilisant Recharts pour la Data Visualization
- 5
Mise en place de WebSockets pour notifier le front dès l'invalidation du cache
Défis Techniques
Limites strictes de l'API externe (5 requêtes/min)
A partir de 6 utilisateurs, l'application crashait. Solution : Le backend Redis absorbe tout le trafic. L'API externe n'est sollicitée qu'une fois par minute, peu importe le nombre d'utilisateurs.
Données obsolètes (Stale Data)
Les courbes financières ne s'actualisaient pas assez vite. Solution : Ajustement du TTL dynamiquement selon les heures d'ouverture de la bourse (cache plus court en journée).
Performance de rendu React
Le navigateur ramait en affichant 5000 points de données. Solution : Downsampling des données côté backend (calcul de moyennes) avant l'envoi au frontend.
Résultats
Temps de réponse de l'API backend divisé par 20 (de 800ms à 40ms via Redis)
Application résiliente face aux pannes complètes de l'API externe (lecture du cache fallback)
Interface fluide et réactive aux standards de l'industrie
Compréhension approfondie des stratégies de caching (Data Delivery)
Explore More