Invalid XML in platform-cluster.svg — Diagrams That Break Builds

In frontend engineering, system architecture diagrams are frequently treated as decorative second-class citizens. An engineer sketches a cluster topology in a vector design application, exports an SVG file into the `public/` directory, and pastes an `<img>` tag into a component. Because modern web browsers are notoriously forgiving with broken XML syntax, malformed markup often remains completely unnoticed.

However, when you operate a strict, automated deployment pipeline that treats all assets as code, an unescaped character in an SVG file is not just a visual imperfection — it is a catastrophic build-breaking defect. This was the exact lesson reinforced when an invalid XML tag in `platform-cluster.svg` crashed our production prerender pipeline.

Our engineering infrastructure page displays a detailed vector diagram depicting the relationship between our primary VPS, secondary infra VPS, Traefik ingress routers, and Woodpecker CI runners. During an update to cluster labels, an unescaped ampersand (`&` instead of `&amp;`) and an unquoted attribute were inadvertently saved inside `platform-cluster.svg`.

← Rafael González Albes