I'm a big fan of aviation, and one lesson from aviation safety has always stuck with me: accidents rarely happen because of a single mistake. Instead, they're usually the result of several small failures lining up in just the wrong way. Pilots and safety engineers often describe this through the Swiss cheese model: every safety layer has holes, but those holes normally don't matter because another layer catches the problem. An accident only becomes possible when all the holes align.

I accidentally learned the same lesson while working on a frontend application.

The accident involved an icon.

It Started as a DX Improvement

Our codebase used a large icon library. Rendering an icon required importing an SVG and passing it to a helper function. It worked, but it was repetitive and made components harder to read.