Agent skill
js-early-exit
Use early returns to avoid unnecessary computation in loops and functions. Apply when processing arrays, validating input, or checking multiple conditions where the result can be determined before all iterations complete.
Install this agent skill to your Project
npx add-skill https://github.com/TheOrcDev/8bitcn-ui/tree/main/.claude/skills/js-early-exit
SKILL.md
Early Return from Functions
Return early when result is determined to skip unnecessary processing. This optimization is especially valuable when the skipped branch is frequently taken or when the deferred operation is expensive.
Incorrect (processes all items even after finding answer):
function validateUsers(users: User[]) {
let hasError = false
let errorMessage = ''
for (const user of users) {
if (!user.email) {
hasError = true
errorMessage = 'Email required'
}
if (!user.name) {
hasError = true
errorMessage = 'Name required'
}
// Continues checking all users even after error found
}
return hasError ? { valid: false, error: errorMessage } : { valid: true }
}
Correct (returns immediately on first error):
function validateUsers(users: User[]) {
for (const user of users) {
if (!user.email) {
return { valid: false, error: 'Email required' }
}
if (!user.name) {
return { valid: false, error: 'Name required' }
}
}
return { valid: true }
}
Recommended Agent Skills
Expand your agent's capabilities with these related and highly-rated skills.
component-wrapper-architecture
Best practices for wrapping shadcn/ui components. Apply when creating 8-bit styled variants of existing shadcn/ui components.
registry-component-patterns
Register components in registry.json for shadcn/ui add command. Apply when adding new 8-bit components to the component library.
retro-css-architecture
Organize 8-bit CSS with custom properties, pixel fonts, and responsive pixel art. Apply when creating or modifying retro-styled components and their CSS.
gaming-ui-state-management
Patterns for game-like interfaces - health bars, XP bars, mana bars. Apply when building RPG/retro gaming UI components with state-driven visuals.
bundle-barrel-imports
Import directly from source files instead of barrel files. Apply when using libraries like lucide-react, @mui/material, or @radix-ui/react-* to reduce bundle size and improve dev boot time.
rendering-hoist-jsx
Extract static JSX elements outside components to avoid re-creation on every render. Apply when rendering static elements repeatedly or in lists.
Didn't find tool you were looking for?