Diagramme de séquence
Montrez comment systèmes et personnes dialoguent
Qu’est-ce qu’un Diagramme de séquence ?
Un diagramme de séquence montre les messages échangés entre participants au fil du temps : appels API, flux d’authentification, communication entre microservices. C’est le standard pour documenter les interactions en architecture logicielle.
Le diagramme de séquence gagne sa place dans les revues de conception et les postmortems, où la question est toujours la même : qui a appelé qui, dans quel ordre, et qu’est-ce qui est revenu. Rien ne révèle plus vite un problème d’ordonnancement ou un timeout manquant. Ce qu’il ne montre pas, c’est l’état : une ligne de vie dit qu’un participant est occupé, jamais dans quel état interne il se trouve, ni ce qu’il retient d’une exécution à l’autre.
Exemple en direct
sequenceDiagram
autonumber
participant U as User
participant A as API
participant D as Database
U->>A: POST /login
A->>D: SELECT user
D-->>A: user row
A-->>U: 200 + JWT token
U->>A: GET /profile (Bearer)
A-->>U: 200 profileQuand l’utiliser
Erreurs fréquentes
Des activations laissées ouvertes
Chaque + appelle un -, et chaque activate un deactivate. Une paire déséquilibrée dessine une barre qui descend jusqu’en bas du diagramme, ou échoue sur « Trying to inactivate an inactive participant ».
L’ordre des participants est celui des déclarations
Mermaid place les participants de gauche à droite dans l’ordre où il les rencontre : celui qui n’apparaît que dans une branche d’erreur atterrit tout à droite. Déclarez chaque participant en tête, dans l’ordre voulu.
Une flèche simple n’est pas un appel
A->B trace un trait plein sans pointe, qui se lit comme s’il ne s’était rien passé. Les appels synchrones s’écrivent ->>, les réponses -->>, les messages sans attente -). Les tirets ne règlent que le style du trait ; c’est la pointe qui porte le sens.
Syntaxe de base
sequenceDiagram
participant A as Alice
participant B as Bob
A->>B: Sync request
B-->>A: Async responsesequenceDiagram autonumberautonumber préfixe chaque message d’un numéro : un relecteur peut renvoyer à « l’étape 4 » dans un commentaire au lieu de décrire la flèche qu’il vise.
U->>+API: POST /orders API-->>-U: 201 CreatedUn + sur une flèche ouvre une barre d’activation chez le destinataire, un - la referme : on voit exactement combien de temps chaque participant reste occupé à traiter l’appel.
note over API,DB: single transactionLes notes portent ce que les flèches ne peuvent pas dire : périmètre transactionnel, politique de réessai, timeouts. note left of ou note right of en attache une à un seul participant.
box Payment domain participant PSP endUn box dessine un cadre étiqueté autour des participants d’un même système ou d’une même équipe. Un nom de couleur placé avant le libellé teinte le cadre.
Questions sur ce diagramme
Que signifient les types de flèches dans un diagramme de séquence Mermaid ?
Les flèches pleines (->>) sont des appels synchrones, les flèches pointillées (-->>) des réponses ou messages asynchrones. Les activations montrent quand un participant est occupé.
Puis-je représenter des boucles et des conditions ?
Oui — Mermaid prend en charge les blocs loop, alt (if/else), opt (optionnel) et par (parallèle) pour exprimer la logique de vrais protocoles.
Puis-je mettre un diagramme de séquence dans la description d’une pull request GitHub ?
Oui : collez le code dans un bloc délimité annoté mermaid, GitHub le rend directement dans les pull requests, les issues et les commentaires. Contrairement à une capture d’écran, le diagramme se compare ensuite ligne à ligne au changement suivant.
Un diagramme de séquence Mermaid peut-il montrer une durée ou une latence ?
Non. L’axe vertical n’exprime que l’ordre : il n’y a aucune échelle de temps, donc deux flèches séparées d’une milliseconde ressemblent à deux flèches séparées d’une heure. Mettez la valeur dans une note, ou passez au Gantt quand la durée est le sujet.
Comment représenter un participant qui n’existe que sur une partie du flux ?
Déclarez-le là où il apparaît avec create participant Worker, et terminez-le par destroy Worker. La ligne de vie démarre alors au message créateur et s’achève sur une croix : c’est ainsi qu’on dessine un job, une session ou un processus temporaire.
Comment mettre en évidence un groupe de messages ?
Entourez-les de rect rgb(240,240,255) … end pour teinter l’arrière-plan, ce qui sert à marquer un bloc de réessai ou une transaction. Les blocs rect s’imbriquent, donc un réessai à l’intérieur d’une transaction reste lisible. Les blocs loop, alt et opt dessinent eux aussi leur propre cadre étiqueté.
Diagramme de séquence ou un autre type de diagramme ?
Diagramme de séquence ou flowchart ?
Comptez les systèmes. Un processus qui tourne dans un seul composant est un flowchart ; deux participants ou plus qui échangent des messages, un diagramme de séquence. Si vous vous surprenez à écrire « le service B reçoit… » dans une boîte de flowchart, changez : les lignes de vie font ce travail pour vous.
Diagramme de séquence ou diagramme d’états ?
Les deux décrivent un comportement dans le temps. Le diagramme de séquence suit une exécution à travers le système et montre le trafic entre participants ; le diagramme d’états couvre toutes les exécutions d’un participant et montre ce qu’il retient. Déboguez avec le premier, spécifiez avec le second.
Créez votre Diagramme de séquence maintenant
Décrivez-le en langage naturel — l’IA écrit le code Mermaid pour vous.
Ouvrir Mermaid Studio