diagrama de sequência online
Diagramas de sequência mostram a ordem de mensagens trocadas entre participantes ao longo do tempo, muito usados para documentar chamadas de API e integrações entre serviços. Este preset já carrega um exemplo de cliente consultando uma API que consulta um banco de dados.
Basta referenciar um nome novo em uma mensagem; o Mermaid cria a coluna automaticamente, mesmo sem declarar participant Cache antes.
A seta -) representa uma mensagem assíncrona, sem uma resposta correspondente esperada, diferente de ->> e -->>.
Mermaid é uma biblioteca JavaScript de código aberto que transforma texto simples, escrito em uma sintaxe própria parecida com Markdown, em diagramas renderizados como SVG. Em vez de desenhar caixas e setas manualmente em uma ferramenta gráfica, você descreve a estrutura do diagrama em algumas linhas de texto e a biblioteca calcula o layout e desenha o resultado.
Não é obrigatório: se um nome aparece só em uma mensagem, o Mermaid cria o participante automaticamente na primeira vez que ele é referenciado. Declarar com participant serve principalmente para controlar a ordem das colunas.
->> desenha uma linha sólida, normalmente usada para uma chamada ou requisição; -->> desenha uma linha tracejada, normalmente usada para uma resposta ou retorno. A distinção visual ajuda a ler o fluxo de ida e volta em uma chamada de API.
Sim, o Mermaid suporta blocos como loop ... end e alt ... else ... end para representar repetição e caminhos alternativos, desenhando uma caixa ao redor das mensagens envolvidas.
Carregando o motor de renderização...
O código Mermaid e o diagrama renderizado ficam só no seu navegador, processados pela biblioteca mermaid.js. Nada é enviado a servidores.