Vue-Hook-Optimizer
Refactor tangled Vue and React components with visual label propagation
Visit vue-hook-optimizer.vercel.app ↗What is Vue-Hook-Optimizer?
Vue-Hook-Optimizer helps developers untangle complex components where multiple hooks and state logic are intertwined. It visualizes how data flows through Options API and Composition API patterns in Vue, as well as React hooks, making it easier to identify which logic belongs together. The tool uses label propagation to trace dependencies and suggest refactoring opportunities, turning "mega-components" into cleaner, more maintainable code. The maker built it with Claude Code to automate the analysis and refactoring suggestions.
The interface displays side-by-side comparisons of different component patterns, from simple counters to complex multi-hook examples. Developers can analyze their own components and see recommendations for splitting logic into smaller, focused units.
Momentum
Daily activity over the last 30 days: upvotes, unique visits, new GitHub stars and Hacker News points.
How do we know it's vibe coded?
vibetrend discovered Vue-Hook-Optimizer automatically. Evidence: HN post: "refactor Vue/React Components with Label Propagation and Claude Code". View source.
Similar vibe-coded apps
#2 this week
#7 this weekOpen-source design workspace that turns coding agents into a local design engine
Free, open-source video editor with auto-captions, effects, and 4K export
Manage teams of AI agents to run your business from one dashboard
Agent development environment for running multiple coding agents in parallel
AI converts documents into natively editable PowerPoint presentations
Open-source video production system directed by AI agents
Open-source AI job search agent that runs locally in your CLI