Diagrammes PlantUML

Démonstration du rendu PlantUML dans OntoWave : diagrammes de classes, d’activités et de composants.

Diagramme de classes

@startuml
class OntoWave {
    +config: Config
    +init(): void
    +render(markdown: string): string
}

class Config {
    +roots: Root[]
    +i18n: I18nConfig
}

class Root {
    +base: string
    +root: string
}

OntoWave --> Config
Config --> Root
@enduml

Diagramme d’activité

@startuml
start
:Chargement de la page;
:Lecture de la configuration;
if (Hash URL présent ?) then (oui)
    :Charge le fichier Markdown cible;
else (non)
    :Charge le fichier index par défaut;
endif
:Rendu HTML;
:Injection dans le DOM;
stop
@enduml

Optimisations de rendu

Les diagrammes PlantUML bénéficient de trois optimisations :

Lazy loading : les diagrammes hors viewport ne sont chargés que lorsqu’ils deviennent visibles (pré-chargement à 200 px de la limite du viewport), via IntersectionObserver.
Cache intelligent : les SVG générés sont mis en cache en mémoire et dans sessionStorage avec un TTL de 30 minutes, évitant les requêtes réseau répétées lors de la navigation.
Compression SVG : les SVG reçus sont compressés (suppression des espaces superflus entre balises) avant stockage.

Limite connue

PlantUML est rendu côté serveur via Kroki.io — les diagrammes nécessitent Internet
Les longs diagrammes peuvent dépasser la limite d’URL de PlantUML

PlantUML Diagrams

Demonstration of PlantUML rendering in OntoWave: class diagrams, activity diagrams and component diagrams.

Class Diagram

@startuml
class OntoWave {
    +config: Config
    +init(): void
    +render(markdown: string): string
}

class Config {
    +roots: Root[]
    +i18n: I18nConfig
}

class Root {
    +base: string
    +root: string
}

OntoWave --> Config
Config --> Root
@enduml

Activity Diagram

@startuml
start
:Page loading;
:Read configuration;
if (URL hash present?) then (yes)
    :Load target Markdown file;
else (no)
    :Load default index file;
endif
:HTML rendering;
:Inject into DOM;
stop
@enduml

Rendering Optimisations

PlantUML diagrams benefit from three optimisations:

Lazy loading: diagrams outside the viewport are only fetched when they become visible (pre-loading 200 px before the viewport edge), using IntersectionObserver.
Smart cache: generated SVGs are cached in memory and in sessionStorage with a 30-minute TTL, avoiding repeated network requests during navigation.
SVG compression: received SVGs are compressed (removal of redundant whitespace between tags) before storage.

Known Limitations

PlantUML is rendered server-side via Kroki.io — diagrams require Internet access
Long diagrams may exceed PlantUML’s URL length limit