\n\nLivrable attendu : Mettre en place un mécanisme empêchant les réponses obsolètes d'écraser l'état courant.","learningResourceType":"Practice problem","educationalLevel":"medium","teaches":["svelte","async","racecondition","reactivity","fetch"],"programmingLanguage":"Svelte","provider":{"@type":"Organization","name":"CodeDuel","url":"https://codeduel.net"},"step":[{"@type":"HowToStep","text":"Analyse de l'énoncé et du code existant."},{"@type":"HowToStep","text":"Implémentation de la solution technique."},{"@type":"HowToStep","text":"Validation par tests unitaires et IA."}]}
Retour aux cas pratiques
SvelteAvancé

Correction d'une condition de concurrence dans un chargement asynchrone

Scénario

Contexte : Une interface Svelte charge des données selon un paramètre dynamique sélectionné par l'utilisateur. Le Problème : Lors de changements rapides du paramètre, des réponses obsolètes écrasent les données plus récentes. Contraintes : Aucune librairie externe. Utiliser uniquement fetch et la réactivité native. Code actuel : <script> import { onMount } from 'svelte'; let id; let data; $: if (id) { fetch(`/api/item/${id}`) .then(res => res.json()) .then(result => data = result); } </script> Livrable attendu : Mettre en place un mécanisme empêchant les réponses obsolètes d'écraser l'état courant.

Compétences ciblées

svelteasyncraceconditionreactivityfetch
    Correction d'une condition de concurrence dans un chargement asynchrone — mise en situation Svelte | CodeDuel