# Refactoring Codebase

> Guidelines for maintaining a clean codebase through limits and abstraction. Use when a file or component becomes difficult to read.

- Skill: `majiayu000/refactoring-codebase` (Agent Skill, multi-file: 2 files)
- Install (CLI): `npx skillmds add majiayu000/refactoring-codebase`
- Raw SKILL.md: https://api.skillmd.com/api/skills/majiayu000/refactoring-codebase/raw
- Safety review: pending
- Works with: Claude Code, Claude.ai, OpenAI Codex
- Category: Web & Frontend
- Author: majiayu000 (https://skillmd.com/u/majiayu000)
- Updated: 2026-09-09
- Page: https://skillmd.com/skills/majiayu000/refactoring-codebase

---


# Refactoring and Code Cleanup

## When to use this skill
- A component file exceeds **200 lines**.
- The same logic is repeated in 3 or more places.
- Props are becoming too many/complex.

## Rules
- **The "Boy Scout Rule"**: Always leave the code slightly cleaner than you found it.
- **Sub-components**: Split large components into smaller files in a local `components/` subfolder.
- **Custom Hooks**: Extract stateful logic (complex forms, complex filters) into hooks.

## Workflow
- [ ] Identify a "Messy" component.
- [ ] Extract presentational parts into atomic components.
- [ ] Extract logic into Services or Hooks.
- [ ] Verify that the visual UI has NOT changed.

## Instructions
- **No Pre-optimization**: Refactor logic only when it's actually reused or the file is unmanageable.

