How the /clone-website Skill Dispatches Builder Agents in Parallel Worktrees

The /clone-website skill dispatches builder agents in parallel worktrees by creating isolated git worktrees for each component specification, launching builders immediately without blocking on completion, and later merging verified branches back into the main codebase.

The ai-website-cloner-template repository implements a sophisticated multi-phase pipeline that transforms live websites into Next.js applications through parallel component generation. According to the skill definition in .github/skills/clone-website/SKILL.md, the system leverages git worktrees and non-blocking agent dispatch to accelerate development while maintaining strict isolation between concurrent builders.

The Multi-Phase Pipeline Architecture

The clone-website skill operates through distinct phases beginning with reconnaissance and ending with component integration. After extracting assets, design tokens, and page topology from the target website, the skill transitions to the Component Specification & Dispatch phase. This phase generates detailed specification files under docs/research/components/ before initiating parallel construction.

Component Specification and Complexity Splitting

For each page section, the skill writes a comprehensive spec file containing screenshots, exact CSS values from getComputedStyle(), interaction models, state diffs, and required assets. The skill evaluates spec size against a complexity budget of approximately 150 lines. Sections exceeding this threshold automatically split into smaller sub-components, ensuring manageable build units for individual agents.

Creating Isolated Worktrees

The skill creates a dedicated git worktree for every sub-component—or whole section when simple. Using the OpenAI SDK's worktreeCreate endpoint (/experimental/worktree), the skill establishes isolated branches such as builder-${componentName}. Each worktree runs a startup script (scripts/setup-builder.sh) to prepare the environment with dependencies before agent dispatch.

import { OpenAI } from '@opencode-ai/sdk';

const client = new OpenAI();

await client.worktree.create({
  repo: 'github.com/JCodesMore/ai-website-cloner-template',
  branch: `builder-${componentName}`,
  startupScript: 'scripts/setup-builder.sh'
});

Parallel Dispatch Strategy

The foreman skill implements a "don't wait" concurrency model. After creating a worktree, the skill immediately dispatches the builder agent and proceeds to extract the next section without awaiting completion. As documented in SKILL.md lines 379-398:

"Don't wait. As soon as you've dispatched the builder(s) for one section, move to extracting the next section. Builders work in parallel in their worktrees while you continue extraction."

This approach enables multiple agents to construct components simultaneously—such as src/components/HeroSection.tsx—while the foreman continues processing the page topology. Each builder operates in complete isolation, preventing interference between concurrent development streams.

const prompt = `
You are a builder agent. Build the component described below.
${specFileContent}
`;

await client.agent.run({
  model: 'claude-3',
  prompt,
  worktree: `builder-${componentName}`
});

Verification and Merge Workflow

Each builder must verify its output by running npx tsc --noEmit before reporting success. Upon completion, the skill merges the worktree branch back into the main branch using the SDK's merge functionality. After every merge, the skill executes npm run build to guarantee a clean, type-safe build before proceeding.

await client.worktree.merge({
  branch: `builder-${componentName}`,
  target: 'main'
});

Full Dispatch Loop

The complete parallel workflow follows this pattern:

for (const section of pageTopology) {
  const spec = await writeSpec(section);
  const worktree = await createWorktree(section.name);
  dispatchBuilder(worktree, spec);   // Non-blocking launch
}
await waitForAllBuilders();
await verifyBuild();                  // npm run build

Key Source Files

• .github/skills/clone-website/SKILL.md – Contains the complete skill definition including the parallel dispatch instructions and "don't wait" methodology.
• .windsurf/workflows/clone-website.md – Human-readable workflow documentation mirroring the skill's parallel worktree approach.
• scripts/sync-skills.mjs – Regenerates the skill across platforms, confirming the skill file as the source of truth.
• node_modules/@opencode-ai/sdk/dist/v2/gen/sdk.gen.js – Implements the worktree API with create, list, reset, and remove endpoints.
• README.md (section "Parallel Build") – High-level overview of the parallel worktree strategy.

Summary

• The /clone-website skill creates isolated git worktrees for each component to prevent conflicts between parallel agents.
• Builder agents launch immediately after worktree creation without blocking the foreman's extraction process.
• A complexity budget of ~150 lines determines when sections split into sub-components for parallel processing.
• Each builder must pass TypeScript verification (npx tsc --noEmit) before merging back to the main branch.
• The system maintains build integrity by running npm run build after every worktree merge.

Frequently Asked Questions

How does the skill prevent conflicts when multiple builders work simultaneously?

The skill creates isolated git worktrees with unique branches for each builder, ensuring file system separation until the final merge step. Each worktree operates as an independent checkout, preventing file collisions or dependency conflicts during parallel construction.

What determines whether a section gets split into sub-components?

The skill evaluates the specification file size against a complexity budget of approximately 150 lines. Sections exceeding this threshold automatically decompose into smaller sub-components, ensuring each builder receives a manageable, focused task that can complete in parallel with others.

Which SDK endpoints does the skill use to manage worktrees?

The skill uses the OpenAI SDK's worktree.create, worktree.merge, and client.agent.run endpoints exposed via /experimental/worktree as implemented in node_modules/@opencode-ai/sdk/dist/v2/gen/sdk.gen.js. These endpoints handle branch creation, isolation, and final integration into the main codebase.

How does the skill verify that parallel builds produce valid code?

Each builder runs npx tsc --noEmit to verify type safety before reporting completion. After the foreman merges a worktree branch, it executes npm run build to ensure the integrated codebase compiles correctly, maintaining consistency throughout the parallel construction process.

{
  "mcpServers": {
    "instagit": {
      "command": "npx",
      "args": ["-y", "instagit@latest"]
    }
  }
}