Wie diese Seite gebaut ist

Diese Website ist das erste System in der Systemübersicht. Hier steht, wie sie gebaut ist, für alle, die die Arbeit prüfen wollen, bevor sie buchen.

Stack

Next.js 16 · TypeScript · Tailwind 4 · next-intl · MDX · Vercel

Sprachen

messages/en.json · messages/de.json · scripts/check-messages.mjs fails the build on a missing key

Buchung

two-click scheduler · no third-party request before the click · self-hosted fonts

Datenmodell der Diagramme

Diagram {
  id, title: { en, de }
  nodes[]: { id, kind: trigger | tool | agent | check | output, label, detail?, tool? }
  edges[]: { from, to, label? }
  checks[]: { node, rule }          // where a person decides
}
layoutDiagram(diagram, "h" | "v")  // ranks by longest path, 8 px grid, no measuring
SystemDiagram                       // inline SVG + visually hidden ordered list
DiagramInteractive                  // draw-in once, node panel, Play narrates the story, Reset

Zahlen

Lighthouse-Performance, Startseite (mobil)

noch zu messen

Lighthouse-Performance, Systemdetail (mobil)

noch zu messen

Lighthouse-Performance, Terminseite (mobil)

noch zu messen

JavaScript auf der Startseite, gzip

noch zu messen

Gemessen am

noch zu messen

Zuletzt gemessen

Die Lighthouse-Werte stehen hier nach dem ersten Produktiv-Deploy, mit dem Datum der Messung. Schriften: Bricolage Grotesque, Instrument Sans und IBM Plex Mono, auf Latin reduziert, 193 KB gesamt, von dieser Domain ausgeliefert. JavaScript-Budget der Startseite: 120 KB gzip, bevor der Terminplaner lädt. Diagramme sind typisierte Daten (Knoten, Kanten, Prüfpunkte), gerendert als SVG und als einfache Liste für Screenreader. Keine Cookies, also kein Cookie-Banner. Reichweitenmessung: Vercel, ohne Cookies.