Skip to content
Development
Agent

before-after

A reference set of small, behavior-preserving refactorings with the reasoning for each. Tests stay green across every one.

From plugin
skills
954 skills54 agents

Claude Code

$ npx -y skills add vanara-agents/skills --agent claude-code

Agent definition

before-after.md

Before / After Transformations

A reference set of small, behavior-preserving refactorings with the reasoning for each. Tests stay green across every one.

1. Decompose a conditional

// BEFORE — the condition's meaning is unclear at the call site
if (date < plan.summerStart || date > plan.summerEnd) {
  charge = quantity * plan.regularRate + plan.regularServiceCharge;
} else {
  charge = quantity * plan.summerRate;
}
// AFTER — intention-revealing functions; the if/else now reads like prose
const isSummer = (date) => !(date < plan.summerStart || date > plan.summerEnd);
const summerCharge  = () => quantity * plan.summerRate;
const regularCharge = () => quantity * plan.regularRate + plan.regularServiceCharge;

charge = isSummer(date) ? summerCharge() : regularCharge();

**Why behavior is preserved:** the boolean and both arithmetic branches are identical; only their names and placement changed.

2. Replace a type-code switch with a lookup table

# BEFORE — repeated dispatch, easy to forget a case
def shipping_cost(kind, weight):
    if kind == "ground":
        return weight * 1.0
    elif kind == "air":
        return weight * 2.5
    elif kind == "freight":
        return weight * 0.6
    raise ValueError(kind)
# AFTER — data, not control flow
RATES = {"ground": 1.0, "air": 2.5, "freight": 0.6}

def shipping_cost(kind, weight):
    if kind not in RATES:
        raise ValueError(kind)
    return weight * RATES[kind]

**Why behavior is preserved:** same rate per kind, same `ValueError` for unknown kinds.

3. Introduce a parameter object

// BEFORE — four loosely-related params that always travel together
function drawRect(x: number, y: number, w: number, h: number) { /* ... */ }
drawRect(0, 0, 100, 40);
// AFTER — one cohesive concept
interface Rect { x: number; y: number; w: number; h: number; }
function drawRect(r: Rect) { /* ...same body, reading r.x etc... */ }
drawRect({ x: 0, y: 0, w: 100, h: 40 });

**Why behavior is preserved:** the same four values reach the same body; only the call shape changed.

4. Inline a needless variable, then rename for clarity

// BEFORE
tmp := basePrice * taxRate
return tmp
// AFTER
return basePrice * taxRate

**Why behavior is preserved:** `tmp` was a pure alias with no other use; removing it changes nothing.

Reading these

Each transformation is the kind of step the agent takes one at a time: small, obviously behavior-preserving, and trivially revertible if a test goes red. None of them changes output for any input — that is the defining property of a refactor.

Read more
@vanara-agents
Ships withskills

🐒 Free agents, skills & packs for Claude Code One subscription. An army of Claude Code agents. 30 production-grade agents, skills, and packs for Claude Code — free, Apache-2.0, install with one command.

917 skills54 agents
Get the whole plugin

Stars on GitHub

Momentum

stars in total
9
Star history of vanara-agents/skills on GitHub, a chart by star-history.com

Other agents on skills.

AGENT

AGENT

Agent

Use when designing a new HTTP/GraphQL API or changing an existing one — modeling resources, defining endpoint contracts, choosing…

review-notes

review-notes

Agent

This shows how the api-designer agent reviews a flawed draft. Findings are severity-ranked so the implementer fixes the…

contract-and-openapi

contract-and-openapi

Agent

The contract is the deliverable. Express it as an **OpenAPI 3.1** document so it is human-readable *and* machine-checkable. This…

design-checklist

design-checklist

Agent

Run through this before declaring an API contract done. It is ordered the way you should *design*: resources first, cross-cutting…

pr-comment-template

pr-comment-template

Agent

Copy-paste templates for leaving review comments. Keep each comment to one finding: an anchor, the problem, and the fix.

More agents from other plugins.

a11y-architect
Auto-invoked

a11y-architect

Agent

Accessibility Architect specializing in WCAG 2.2 compliance for Web and Native platforms. Use PROACTIVELY when designing UI…

ecc13d293k
@affaan-m@affaan-mInstall Agent
analyze-pass-impact

analyze-pass-impact

Agent

Analyzes how a specific topic affects a group of compiler passes. Used by the /plan-update skill to parallelize research across…

react3d252k
@facebook@facebookInstall Agent
orchestrator

orchestrator

Agent

- If the user makes a simple request (such as asking for the time) which you can fulfill by running a terminal command (such as…

codex2d135k
@openai@openaiInstall Agent
cavecrew-builder

cavecrew-builder

Agent

Surgical 1-2 file edit. Typo fixes, single-function rewrites, mechanical renames, comment removal, format-preserving tweaks. Hard…

caveman3d119k
@juliusbrussee@juliusbrusseeInstall Agent

Questions about before-after.

Which coding agents can use before-after?
before-after installs in Claude Code and Cursor: each loads subagents from .claude/agents, so copy the file there. Flowy's auto-invocation runs in Claude Code only.