This post was drafted with AI assistance and reviewed by the PerfectVector team.

SVGO made our badge almost 40% smaller and broke the page it lived on. The file still rendered fine on its own. What disappeared was an id the surrounding HTML used to recolor one shape, and nothing in SVGO's output warns you about that. If your page, script or sprite reaches into an SVG, run the optimizer on a copy and test the copy where it's actually used.

Here's the fixture: a 437-byte hand-made badge whose sun is <circle id="badge-accent" ... fill="#ef8067"/> , inlined in a page with #badge-accent { fill: #f5bf42; } outside the SVG. With SVGO 4.1.0 in a clean folder (so no stray svgo.config.mjs is picked up), npx svgo input.svg -o default.svg writes 263 bytes, and the id is gone. The sun stays coral instead of turning gold. That's documented behaviour: cleanupIds "removes unused IDs", and an ID referenced only by CSS in another document looks unused from inside the file.…