Dans le développement web moderne, la vitesse n'est pas un luxe, c'est une nécessité. Pourtant, beaucoup de développeurs introduisent sans le savoir des ralentissements en gérant mal l'asynchronisme.
Aujourd'hui, nous allons voir comment passer de l'exécution séquentielle à la parallélisation avec Promise.all, et comment sécuriser votre interface avec Promise.allSettled.
Le problème : L'exécution séquentielle (Waterfall)
Imaginez que vous développez un tableau de bord. Pour l'afficher, vous avez besoin de trois informations indépendantes : le profil, les notifications et les messages.
JavaScript
async function loadDashboard() {
const user = await getUser(); // 200ms
const notifications = await getNotifications(); // 200ms
const messages = await getMessages(); // 200ms
// Total : 600ms
}
Ici, chaque ligne attend la fin de la précédente. C'est l'effet "Waterfall". Le navigateur reste bloqué alors qu'il pourrait traiter ces requêtes simultanément.
La solution 1 : La performance avec Promise.all
Promise.all permet de lancer toutes les requêtes en même temps. On ne fait plus la queue, on utilise toutes les caisses disponibles.
Commentaires