The Duplication Problem
How it happens
- • New dev doesn't know Button exists, creates LoginButton
- • Feature team copies component instead of importing
- • Legacy code kept "just in case" alongside new version
- • AI generates new component instead of using existing
Why it matters
- ✓ Larger bundle size = slower load times
- ✓ More components = more maintenance
- ✓ Inconsistent behavior confuses users
- ✓ Design changes need N updates instead of 1
See it in action
buoy-cli
$
âš“ Scanning for duplicate components...
âš Found 3 duplicate component patterns
Duplicate 1: Button implementations
├─ src/components/Button.tsx
├─ src/features/auth/LoginButton.tsx
└─ src/legacy/OldButton.tsx
Duplicate 2: Card layouts
├─ src/components/Card.tsx
└─ src/features/dashboard/InfoCard.tsx
Duplicate 3: Modal dialogs
├─ src/components/Modal.tsx
└─ src/components/Dialog.tsx
What We Detect
Component Clones
Multiple implementations of the same UI pattern (buttons, cards, modals)
Style Duplicates
Same styles defined in multiple places instead of shared tokens
Utility Overlap
Helper functions that do the same thing with different names
Pattern Similarity
Components that could be consolidated with props/variants
How Detection Works
1
AST Analysis
Parses component structure, not just text matching
2
Pattern Matching
Identifies similar prop signatures and render patterns
3
Similarity Score
Ranks duplicates by how similar they are (80%+ = likely duplicate)