Initial commit

This commit is contained in:
Zhongwei Li
2025-11-29 18:28:57 +08:00
commit 995d97df60
11 changed files with 3977 additions and 0 deletions

View File

@@ -0,0 +1,199 @@
# Context Manager Examples
Real-world examples of multi-agent workflow context management and state persistence.
## Quick Navigation
| Example | Workflow Type | Agents Involved | Context Size | Complexity |
|---------|---------------|-----------------|--------------|------------|
| [Feature Development Handoff](feature-development-handoff.md) | Sequential | 4 agents | Medium | Moderate |
| [Incident Response Workflow](incident-response-workflow.md) | Parallel + Sequential | 6 agents | Large | High |
| [Code Review Pipeline](code-review-pipeline.md) | Conditional | 3 agents | Small | Low |
| [Multi-Session Refactoring](multi-session-refactoring.md) | Resumable | 5 agents | Large | Very High |
## Context Management Patterns
### Pattern 1: Sequential Handoff
**Use Case:** Linear workflow where each agent completes before next begins
**Example**: Design → Implement → Test → Deploy
```
Agent A (Designer) → Context Save → Agent B (Developer)
→ Context Save → Agent C (Tester)
→ Context Save → Agent D (DevOps)
```
**Context Contains:**
- Decisions made by previous agents
- Modified files
- Pending actions for next agent
- Constraints and requirements
### Pattern 2: Parallel Execution
**Use Case:** Multiple agents work concurrently on independent tasks
**Example**: Frontend + Backend + Database development in parallel
```
Context Fork → Agent A (Frontend) → Context Merge
→ Agent B (Backend) →
→ Agent C (Database) →
```
**Challenges:**
- Conflict resolution when merging
- Dependency coordination
- Partial failure handling
### Pattern 3: Conditional Routing
**Use Case:** Next agent determined by previous agent's outcome
**Example**: Code review → (Pass: Deploy) | (Fail: Fix) → Re-review
```
Agent A (Reviewer) → Decision Point → (if pass) Agent B (Deploy)
→ (if fail) Agent C (Fix) → back to Agent A
```
**Context Needs:**
- Decision criteria
- Route history
- Loop detection
### Pattern 4: Long-Running Resumable
**Use Case:** Workflow spans multiple sessions/days
**Example**: Large codebase refactoring over 3 days
```
Day 1: Agent A → Save checkpoint
Day 2: Restore → Agent A continues → Save checkpoint
Day 3: Restore → Agent B (testing) → Complete
```
**Critical Features:**
- Robust serialization
- Version compatibility
- Progress tracking
- Partial completion handling
## Context Size Benchmarks
| Workflow Type | Avg Context Size | Serialization Time | Restore Time |
|---------------|------------------|-------------------|--------------|
| Simple (1-2 agents) | 5-10 KB | < 10ms | < 10ms |
| Moderate (3-5 agents) | 20-50 KB | 20-50ms | 20-50ms |
| Complex (6+ agents) | 100-200 KB | 100-200ms | 100-200ms |
| Large (multi-session) | 500KB-2MB | 500ms-1s | 500ms-1s |
**Optimization Target:** < 100KB for 80% of workflows
## State Management Strategies
### Minimal State
**Principle:** Only save essential context
**Includes:**
- File paths (not file contents)
- Decision summaries (not full reasoning)
- Pending actions (not completed tasks)
**Benefits:**
- Faster serialization
- Lower storage
- Easier debugging
### Comprehensive State
**Principle:** Save everything for full resumption
**Includes:**
- Complete conversation history
- All file modifications
- Full reasoning chains
- Error logs
**Benefits:**
- Perfect restoration
- Complete audit trail
- Advanced debugging
### Hybrid Approach
**Principle:** Essential + compression
**Strategy:**
- Essential context in JSON
- Full history compressed separately
- Load essential first, decompress on demand
## Common Pitfalls
### Pitfall 1: Context Bloat
**Symptom:** Context grows unbounded
**Solution:** Pruning strategy - remove completed tasks, compress history
### Pitfall 2: Version Incompatibility
**Symptom:** Can't restore old contexts after updates
**Solution:** Context versioning with migration scripts
### Pitfall 3: Missing Dependencies
**Symptom:** Context refers to external state that changed
**Solution:** Capture or validate external dependencies
### Pitfall 4: Concurrent Modification
**Symptom:** Two agents modify same context simultaneously
**Solution:** Locking or optimistic concurrency
### Pitfall 5: Sensitive Data in Context
**Symptom:** API keys, passwords in saved context
**Solution:** Redaction and encryption
## Success Metrics
**Context Quality Indicators:**
- Restoration success rate: Target > 99%
- Context size vs workflow complexity: Linear relationship
- Time to restore: Target < 1 second
- Agent resume success: Target > 95%
**Workflow Efficiency:**
- Reduced re-work: 70% reduction
- Faster handoffs: < 30 seconds
- Session continuity: Seamless multi-day workflows
## Quick Reference: Context Schema
**Minimal Required Fields:**
```json
{
"version": "1.0",
"workflow_id": "unique-id",
"timestamp": "ISO-8601",
"current_agent": "agent-name",
"next_agent": "agent-name",
"phase": "current-phase",
"files_modified": ["paths"],
"decisions": ["summaries"],
"pending_actions": ["tasks"]
}
```
**Extended Optional Fields:**
```json
{
"conversation_history": [...],
"error_log": [...],
"checkpoints": [...],
"metadata": {...}
}
```
## Navigation Tips
- **New to context management?** Start with [Code Review Pipeline](code-review-pipeline.md)
- **Complex workflows?** See [Feature Development Handoff](feature-development-handoff.md)
- **Multi-session work?** Check [Multi-Session Refactoring](multi-session-refactoring.md)
- **Parallel agents?** Review [Incident Response Workflow](incident-response-workflow.md)
---
**Total Examples**: 4 comprehensive workflow scenarios
**Patterns Covered**: Sequential, Parallel, Conditional, Resumable
**Context Sizes**: 5KB to 2MB
**Success Rate**: 99%+ restoration across all patterns

View File

@@ -0,0 +1,501 @@
# Feature Development Handoff Example
Complete multi-agent workflow for feature development with context handoffs.
**Workflow**: Design → Implement → Test → Deploy
**Duration**: 4-6 hours
**Agents**: 4 (backend-architect, tdd-typescript, test-generator, devops-troubleshooter)
**Context Handoffs**: 3
---
## Workflow Overview
```
User Request → Backend Architect → TDD TypeScript → Test Generator → DevOps Deploy
↓ save ↓ save ↓ save ↓
context-1 context-2 context-3 ✅ Complete
```
---
## Phase 1: Architecture Design
**Agent**: `backend-architect`
**Goal**: Design API endpoints and data model
**User Input**:
"Add user preferences feature: users can save theme (light/dark), language (en/es/fr), and notification settings (email, push)."
**Agent Work**:
1. Analyzes requirements
2. Designs database schema
3. Plans API endpoints
4. Creates OpenAPI spec
**Output**:
```typescript
// Designed schema
interface UserPreferences {
user_id: string;
theme: 'light' | 'dark';
language: 'en' | 'es' | 'fr';
notifications: {
email: boolean;
push: boolean;
};
updated_at: Date;
}
// Planned endpoints
GET /api/v1/users/:id/preferences
PUT /api/v1/users/:id/preferences
PATCH /api/v1/users/:id/preferences
```
**Decisions Made**:
- Use JSONB column in PostgreSQL for preferences (flexibility)
- PUT for full replace, PATCH for partial update
- Include updated_at for conflict resolution
- Rate limit: 10 requests/minute per user
**Context Save** (`context-001-design.json`):
```json
{
"version": "1.0",
"workflow_id": "feature-user-prefs-20250115",
"timestamp": "2025-01-15T10:30:00Z",
"current_agent": "backend-architect",
"next_agent": "tdd-typescript",
"phase": "design-complete",
"files_modified": [
"docs/api/user-preferences.md",
"docs/architecture/decisions/adr-012-user-prefs-storage.md"
],
"decisions": [
"Use JSONB for flexibility in preferences structure",
"Implement both PUT (full) and PATCH (partial) updates",
"Rate limit to 10 req/min per user to prevent abuse",
"Include updated_at for optimistic locking"
],
"data_model": {
"table": "user_preferences",
"columns": {
"id": "UUID PRIMARY KEY",
"user_id": "UUID REFERENCES users(id)",
"preferences": "JSONB NOT NULL",
"created_at": "TIMESTAMP DEFAULT NOW()",
"updated_at": "TIMESTAMP DEFAULT NOW()"
},
"indexes": [
"user_id (unique)",
"updated_at"
]
},
"api_spec": {
"endpoints": [
{
"method": "GET",
"path": "/api/v1/users/:id/preferences",
"auth_required": true,
"rate_limit": "10/minute",
"response": "UserPreferences"
},
{
"method": "PUT",
"path": "/api/v1/users/:id/preferences",
"auth_required": true,
"body": "UserPreferencesUpdate",
"response": "UserPreferences"
},
{
"method": "PATCH",
"path": "/api/v1/users/:id/preferences",
"auth_required": true,
"body": "Partial<UserPreferencesUpdate>",
"response": "UserPreferences"
}
]
},
"pending_actions": [
"Implement API endpoints with TDD approach",
"Create database migration",
"Add validation for preference values",
"Implement rate limiting middleware"
],
"constraints": [
"Must maintain backward compatibility",
"Performance: GET should be < 50ms",
"Must handle concurrent updates (optimistic locking)"
]
}
```
**Handoff Message**:
"Design complete. Data model uses JSONB for flexibility. Three endpoints designed (GET/PUT/PATCH). Ready for TDD implementation. Key constraints: < 50ms response, handle concurrency, rate limiting."
---
## Phase 2: TDD Implementation
**Agent**: `tdd-typescript-implementer`
**Goal**: Implement API endpoints following TDD
**Context Restore**:
```typescript
// Agent loads context-001-design.json
const context = await loadContext('feature-user-prefs-20250115');
console.log('Previous agent:', context.current_agent);
console.log('Decisions:', context.decisions);
console.log('Next steps:', context.pending_actions);
console.log('Constraints:', context.constraints);
```
**Agent Work**:
Following RED-GREEN-REFACTOR cycle:
**Cycle 1**: GET /preferences endpoint
```typescript
// RED: Write failing test
describe('GET /api/v1/users/:id/preferences', () => {
it('returns user preferences', async () => {
const response = await request(app)
.get('/api/v1/users/user-123/preferences')
.set('Authorization', 'Bearer token');
expect(response.status).toBe(200);
expect(response.body).toMatchObject({
user_id: 'user-123',
theme: 'light',
language: 'en'
});
});
});
// ❌ Test fails - endpoint doesn't exist
// GREEN: Minimal implementation
router.get('/users/:id/preferences', authenticate, async (req, res) => {
const prefs = await db.getUserPreferences(req.params.id);
res.json(prefs);
});
// ✅ Test passes
// REFACTOR: Add caching, validation
router.get('/users/:id/preferences',
authenticate,
validateUserId,
cacheMiddleware({ ttl: 300 }),
async (req, res) => {
const prefs = await db.getUserPreferences(req.params.id);
res.json(prefs);
}
);
// ✅ All tests still pass
```
**Cycle 2-4**: PUT and PATCH endpoints (similar process)
**Context Save** (`context-002-implementation.json`):
```json
{
"version": "1.0",
"workflow_id": "feature-user-prefs-20250115",
"timestamp": "2025-01-15T14:45:00Z",
"current_agent": "tdd-typescript",
"next_agent": "test-generator",
"phase": "implementation-complete",
"files_modified": [
"src/api/routes/user-preferences.ts",
"src/api/middleware/rate-limit.ts",
"src/db/repositories/preferences.ts",
"src/types/user-preferences.ts",
"migrations/2025-01-15-user-preferences.sql"
],
"test_results": {
"total": 18,
"passing": 18,
"failing": 0,
"coverage": {
"line": 96,
"branch": 94,
"function": 100
}
},
"decisions": [
"Added caching (5min TTL) for GET endpoint",
"Implemented optimistic locking with updated_at",
"Used Zod for runtime validation",
"Rate limiting uses Redis for distributed systems"
],
"pending_actions": [
"Generate comprehensive integration tests",
"Add E2E tests for full user flows",
"Test edge cases (concurrent updates, invalid data)",
"Performance testing under load"
],
"metrics": {
"implementation_time": "3.5 hours",
"test_count": 18,
"code_loc": 420,
"test_loc": 580
}
}
```
**Handoff Message**:
"Implementation complete with 18 passing tests, 96% coverage. All three endpoints functional. Caching, validation, rate limiting implemented. Ready for comprehensive testing."
---
## Phase 3: Test Generation
**Agent**: `test-generator`
**Goal**: Create comprehensive test suite
**Context Restore**:
```typescript
const context = await loadContext('feature-user-prefs-20250115');
const implementedFiles = context.files_modified;
const coverageGaps = identifyGaps(context.test_results.coverage);
```
**Agent Work**:
1. Analyzes implementation
2. Identifies uncovered branches
3. Generates integration tests
4. Creates E2E test scenarios
**Generated Tests**:
**Integration Test**:
```typescript
describe('User Preferences Integration', () => {
it('handles concurrent updates correctly', async () => {
const userId = 'user-123';
// Simulate two clients updating simultaneously
const [update1, update2] = await Promise.allSettled([
api.updatePreferences(userId, { theme: 'dark' }),
api.updatePreferences(userId, { language: 'es' })
]);
// One should succeed, one should get conflict (409)
const statuses = [update1.status, update2.status].sort();
expect(statuses).toEqual([200, 409]);
// Final state should be consistent
const final = await api.getPreferences(userId);
expect(final.theme === 'dark' || final.language === 'es').toBe(true);
});
it('respects rate limits', async () => {
const requests = Array(15).fill(null).map(() =>
api.updatePreferences('user-123', { theme: 'dark' })
);
const results = await Promise.allSettled(requests);
const rateLimited = results.filter(r => r.status === 429);
expect(rateLimited.length).toBeGreaterThan(0); // Some rejected
});
});
```
**Context Save** (`context-003-testing.json`):
```json
{
"version": "1.0",
"workflow_id": "feature-user-prefs-20250115",
"timestamp": "2025-01-15T16:30:00Z",
"current_agent": "test-generator",
"next_agent": "devops-troubleshooter",
"phase": "testing-complete",
"files_modified": [
"tests/integration/user-preferences.test.ts",
"tests/e2e/preferences-flow.test.ts",
"tests/performance/preferences-load.test.ts"
],
"test_results": {
"unit": { "total": 18, "passing": 18 },
"integration": { "total": 12, "passing": 12 },
"e2e": { "total": 5, "passing": 5 },
"performance": {
"avg_response_time": "42ms",
"p95_response_time": "68ms",
"p99_response_time": "95ms",
"throughput": "450 req/sec"
}
},
"final_coverage": {
"line": 98,
"branch": 97,
"function": 100
},
"pending_actions": [
"Deploy to staging environment",
"Run smoke tests in staging",
"Monitor error rates and performance",
"Deploy to production with canary"
],
"quality_gates_passed": {
"coverage": true,
"performance": true,
"security": true,
"accessibility": true
}
}
```
**Handoff Message**:
"Testing complete. 35 tests total, all passing. 98% coverage. Performance within targets (< 50ms avg). Ready for deployment."
---
## Phase 4: Deployment
**Agent**: `devops-troubleshooter`
**Goal**: Deploy to staging and production
**Context Restore**:
```typescript
const context = await loadContext('feature-user-prefs-20250115');
const performanceMetrics = context.test_results.performance;
const qualityGates = context.quality_gates_passed;
// Verify all gates passed
if (!Object.values(qualityGates).every(passed => passed)) {
throw new Error('Quality gates not met - cannot deploy');
}
```
**Agent Work**:
1. Creates deployment pipeline
2. Deploys to staging
3. Runs smoke tests
4. Deploys to production (canary)
5. Monitors rollout
**Deployment Steps**:
```yaml
# .github/workflows/deploy-user-prefs.yml
name: Deploy User Preferences Feature
on:
workflow_dispatch:
inputs:
environment:
description: 'Environment'
required: true
type: choice
options:
- staging
- production
jobs:
deploy:
steps:
- name: Run tests
run: npm test
- name: Check coverage
run: npm run coverage -- --threshold=95
- name: Deploy to staging
if: inputs.environment == 'staging'
run: |
npx wrangler deploy --env staging
npm run smoke-test:staging
- name: Deploy to production (canary)
if: inputs.environment == 'production'
run: |
npx wrangler deploy --env production --percentage 10
npm run monitor:canary
- name: Full rollout
if: inputs.environment == 'production'
run: npx wrangler deploy --env production --percentage 100
```
**Final Context** (`context-004-complete.json`):
```json
{
"version": "1.0",
"workflow_id": "feature-user-prefs-20250115",
"timestamp": "2025-01-15T18:00:00Z",
"current_agent": "devops-troubleshooter",
"next_agent": null,
"phase": "deployed",
"deployment": {
"staging": {
"deployed_at": "2025-01-15T17:15:00Z",
"smoke_tests": "passed",
"url": "https://staging.example.com"
},
"production": {
"canary_started": "2025-01-15T17:45:00Z",
"canary_percentage": 10,
"full_rollout": "2025-01-15T17:55:00Z",
"url": "https://api.example.com"
}
},
"monitoring": {
"error_rate": "0.02%",
"avg_latency": "38ms",
"p99_latency": "89ms",
"requests_served": 12500
},
"status": "complete",
"total_duration": "7.5 hours",
"agents_involved": 4,
"context_handoffs": 3
}
```
---
## Lessons Learned
**What Went Well**:
- Clear context handoffs prevented re-work
- Performance targets met from design phase
- TDD approach caught issues early
- Automated deployment smooth
**Improvements for Next Time**:
- Could have parallelized testing and deployment prep
- Context size grew large - could compress history
- Should add rollback procedure to context
**Metrics**:
- **Time saved** vs starting fresh each phase: ~40%
- **Context restore success**: 100%
- **Quality maintained** across all handoffs: Yes
---
**Total Workflow Time**: 7.5 hours
**Agents Involved**: 4
**Context Saves**: 4
**Handoff Success Rate**: 100%
**Final Quality**: Production-ready

View File

@@ -0,0 +1,873 @@
# Parallel Workflow Example: Full-Stack Feature Implementation
Complete example of parallel agent execution with context merge.
**Scenario**: Implement user profile feature with frontend, backend, and tests developed concurrently.
**Workflow Pattern**: Parallel Execution → Merge → Integration
---
## Overview
**Timeline**: ~2 hours (vs 6 hours sequential)
**Agents Involved**:
1. **Parent Orchestrator** - Coordinates parallel work
2. **Frontend Developer** - React components (parallel)
3. **Backend Developer** - API endpoints (parallel)
4. **Test Generator** - E2E tests (parallel)
5. **Integration Verifier** - Merge and verify (sequential)
**Speedup**: 3x faster than sequential execution
---
## Phase 1: Parent Context Initialization
**Agent**: Orchestrator
**Duration**: 5 minutes
**Purpose**: Define overall feature and spawn parallel tasks
### Parent Context Save
```json
{
"version": "1.0",
"workflow_id": "user-profile-feature-20250115",
"timestamp": "2025-01-15T09:00:00Z",
"current_agent": "orchestrator",
"next_agent": null,
"phase": "parallel-execution",
"feature_spec": {
"name": "User Profile Management",
"description": "Allow users to view and edit their profile information",
"requirements": [
"View profile (name, email, avatar, bio)",
"Edit profile fields",
"Upload avatar image",
"Validate email format",
"Real-time validation feedback"
]
},
"parallel_tasks": [
{
"task_id": "frontend-impl",
"agent": "react-tanstack-developer",
"scope": "Build React components for profile view and edit",
"context_ref": ".claude/context/user-profile-feature-20250115-frontend.json",
"status": "in_progress",
"started_at": "2025-01-15T09:05:00Z"
},
{
"task_id": "backend-impl",
"agent": "tdd-python-developer",
"scope": "Implement profile API endpoints with TDD",
"context_ref": ".claude/context/user-profile-feature-20250115-backend.json",
"status": "in_progress",
"started_at": "2025-01-15T09:05:00Z"
},
{
"task_id": "test-impl",
"agent": "playwright-tester",
"scope": "Create E2E tests for profile feature",
"context_ref": ".claude/context/user-profile-feature-20250115-tests.json",
"status": "in_progress",
"started_at": "2025-01-15T09:05:00Z"
}
],
"shared_constraints": [
"Must use existing auth system",
"Profile data stored in PostgreSQL users table",
"Avatar images stored in Cloudflare R2",
"Real-time updates via WebSocket optional (nice-to-have)"
],
"integration_requirements": [
"Frontend calls backend API",
"API returns expected data format",
"E2E tests validate full flow",
"All tests pass in CI"
],
"success_criteria": {
"backend": [
"API endpoints: GET /api/profile, PUT /api/profile",
"Test coverage >90%",
"Response time <100ms"
],
"frontend": [
"ProfileView and ProfileEdit components",
"Form validation with Zod",
"Avatar upload with preview",
"Component tests >85% coverage"
],
"e2e": [
"Complete user flow tested",
"Error cases covered",
"All tests passing"
]
},
"context_summary": "Initialized parallel development of user profile feature with 3 concurrent tracks: frontend (React), backend (Python), and E2E tests (Playwright)."
}
```
**File**: `.claude/context/user-profile-feature-20250115.json`
---
## Phase 2A: Frontend Implementation (Parallel)
**Agent**: React-TanStack Developer
**Duration**: 45 minutes (runs in parallel with backend and tests)
### Frontend Context Save
```json
{
"version": "1.0",
"workflow_id": "user-profile-feature-20250115-frontend",
"parent_workflow_id": "user-profile-feature-20250115",
"task_id": "frontend-impl",
"timestamp": "2025-01-15T09:50:00Z",
"current_agent": "react-tanstack-developer",
"next_agent": null,
"phase": "frontend-complete",
"files_modified": [
"src/routes/profile/index.tsx",
"src/routes/profile/edit.tsx",
"src/components/ProfileView.tsx",
"src/components/ProfileEdit.tsx",
"src/components/AvatarUpload.tsx",
"src/lib/validation/profile-schema.ts",
"tests/components/ProfileView.test.tsx",
"tests/components/ProfileEdit.test.tsx"
],
"decisions": [
"Use TanStack Query for profile data fetching",
"Use TanStack Form for profile edit form",
"Zod schema for client-side validation",
"Optimistic updates for better UX",
"Avatar preview before upload using FileReader API"
],
"pending_actions": [
"Integrate with backend API endpoints (waiting for backend-impl)",
"Update API base URL in production config",
"Add loading states and error handling",
"Accessibility audit (WCAG 2.1 AA)"
],
"implementation_details": {
"components": {
"ProfileView": {
"path": "src/components/ProfileView.tsx",
"props": "{ userId: string }",
"key_features": [
"Fetches profile with TanStack Query",
"Displays avatar, name, email, bio",
"Edit button navigates to /profile/edit",
"Loading skeleton",
"Error boundary"
]
},
"ProfileEdit": {
"path": "src/components/ProfileEdit.tsx",
"props": "{ userId: string, onSuccess: () => void }",
"key_features": [
"TanStack Form with Zod validation",
"Real-time validation feedback",
"Avatar upload with preview",
"Optimistic updates",
"Cancel discards changes"
]
},
"AvatarUpload": {
"path": "src/components/AvatarUpload.tsx",
"props": "{ currentAvatar?: string, onUpload: (file: File) => void }",
"key_features": [
"Drag-and-drop or click to upload",
"Image preview before upload",
"Client-side validation (max 5MB, jpg/png only)",
"Crop modal (optional enhancement)"
]
}
},
"validation_schema": {
"path": "src/lib/validation/profile-schema.ts",
"schema": "z.object({ name: z.string().min(1).max(100), email: z.string().email(), bio: z.string().max(500).optional(), avatar: z.instanceof(File).optional() })",
"shared_with_backend": false
},
"test_coverage": {
"total": "87%",
"files": {
"ProfileView.test.tsx": "92% - tests loading, error, success states",
"ProfileEdit.test.tsx": "85% - tests validation, submission, cancel"
}
}
},
"api_contract_assumptions": {
"GET /api/profile/:userId": {
"response": "{ id: string, name: string, email: string, bio?: string, avatar_url?: string }",
"error_codes": [401, 404]
},
"PUT /api/profile/:userId": {
"request": "{ name: string, email: string, bio?: string }",
"response": "{ id: string, name: string, email: string, bio?: string, avatar_url?: string }",
"error_codes": [400, 401, 404]
},
"POST /api/profile/:userId/avatar": {
"request": "multipart/form-data with 'avatar' field",
"response": "{ avatar_url: string }",
"error_codes": [400, 413]
}
},
"context_summary": "Implemented React components for user profile (view and edit) with TanStack Query/Form, Zod validation, and avatar upload. 87% test coverage. Ready for backend API integration."
}
```
**File**: `.claude/context/user-profile-feature-20250115-frontend.json`
**Execution Time**: 45 minutes
---
## Phase 2B: Backend Implementation (Parallel)
**Agent**: TDD-Python Developer
**Duration**: 60 minutes (runs in parallel with frontend and tests)
### Backend Context Save
```json
{
"version": "1.0",
"workflow_id": "user-profile-feature-20250115-backend",
"parent_workflow_id": "user-profile-feature-20250115",
"task_id": "backend-impl",
"timestamp": "2025-01-15T10:05:00Z",
"current_agent": "tdd-python-developer",
"next_agent": null,
"phase": "backend-complete",
"files_modified": [
"src/api/routes/profile.py",
"src/models/user.py",
"src/schemas/profile.py",
"tests/api/test_profile.py",
"tests/integration/test_profile_flow.py",
"alembic/versions/003_add_bio_to_users.py"
],
"decisions": [
"Use FastAPI for REST endpoints",
"Pydantic v2 for request/response schemas",
"SQLModel for database ORM",
"Cloudflare R2 for avatar storage via presigned URLs",
"JWT authentication (existing auth system)",
"Rate limiting: 10 profile updates per hour per user"
],
"pending_actions": [
"Configure R2 bucket in production (cloudflare-r2-avatars)",
"Set environment variables: R2_ACCOUNT_ID, R2_ACCESS_KEY_ID, R2_SECRET_ACCESS_KEY",
"Run database migration: alembic upgrade head",
"Add CORS configuration for frontend domain"
],
"implementation_details": {
"endpoints": {
"GET /api/profile/{user_id}": {
"auth": "Required (JWT)",
"permissions": "User can only view own profile or public profiles",
"response_model": "ProfileResponse",
"cache": "60 seconds",
"performance": "Avg 45ms, P99 85ms"
},
"PUT /api/profile/{user_id}": {
"auth": "Required (JWT)",
"permissions": "User can only edit own profile",
"request_model": "ProfileUpdateRequest",
"response_model": "ProfileResponse",
"validation": "Email uniqueness, name min 1 char, bio max 500 chars",
"performance": "Avg 120ms, P99 200ms"
},
"POST /api/profile/{user_id}/avatar": {
"auth": "Required (JWT)",
"permissions": "User can only upload to own profile",
"request": "multipart/form-data",
"validation": "Max 5MB, jpg/png/gif only",
"response_model": "AvatarUploadResponse",
"storage": "Cloudflare R2 with public URL",
"performance": "Avg 850ms, P99 1500ms"
}
},
"schemas": {
"ProfileResponse": {
"fields": "id: UUID, name: str, email: EmailStr, bio: Optional[str], avatar_url: Optional[str], created_at: datetime, updated_at: datetime"
},
"ProfileUpdateRequest": {
"fields": "name: str (min 1, max 100), email: EmailStr, bio: Optional[str] (max 500)",
"validators": "Email uniqueness check, name not empty"
},
"AvatarUploadResponse": {
"fields": "avatar_url: str"
}
},
"database_changes": {
"migration": "003_add_bio_to_users",
"changes": [
"Add 'bio' column to users table (TEXT, nullable)",
"Add 'avatar_url' column to users table (VARCHAR(500), nullable)",
"Add index on users.email for uniqueness check"
]
},
"test_coverage": {
"total": "94%",
"files": {
"test_profile.py": "Unit tests for endpoints - 95% coverage",
"test_profile_flow.py": "Integration tests for full flow - 92% coverage"
},
"test_count": {
"total": 28,
"unit": 18,
"integration": 10
}
}
},
"security_measures": [
"JWT authentication on all endpoints",
"Permission check: user can only modify own profile",
"Email validation and sanitization",
"SQL injection prevention via SQLModel ORM",
"File upload validation (type, size)",
"Rate limiting on profile updates",
"CORS restricted to frontend domain only"
],
"context_summary": "Implemented FastAPI profile endpoints (GET, PUT, POST /avatar) with TDD approach. 94% test coverage (28 tests). Database migration ready. Avatar storage on Cloudflare R2. JWT auth and rate limiting implemented."
}
```
**File**: `.claude/context/user-profile-feature-20250115-backend.json`
**Execution Time**: 60 minutes
---
## Phase 2C: E2E Test Implementation (Parallel)
**Agent**: Playwright Tester
**Duration**: 50 minutes (runs in parallel with frontend and backend)
### E2E Tests Context Save
```json
{
"version": "1.0",
"workflow_id": "user-profile-feature-20250115-tests",
"parent_workflow_id": "user-profile-feature-20250115",
"task_id": "test-impl",
"timestamp": "2025-01-15T09:55:00Z",
"current_agent": "playwright-tester",
"next_agent": null,
"phase": "e2e-tests-complete",
"files_modified": [
"e2e/profile/view-profile.spec.ts",
"e2e/profile/edit-profile.spec.ts",
"e2e/profile/upload-avatar.spec.ts",
"e2e/fixtures/test-users.json",
"e2e/utils/profile-helpers.ts"
],
"decisions": [
"Use Playwright for E2E testing",
"Test against local development server",
"Create dedicated test user accounts",
"Use Page Object Model pattern",
"Visual regression testing for avatar uploads"
],
"pending_actions": [
"Configure E2E tests in CI pipeline",
"Set up test database seeding",
"Add visual regression baseline images",
"Run tests against staging before merge"
],
"implementation_details": {
"test_files": {
"view-profile.spec.ts": {
"tests": 5,
"scenarios": [
"View own profile - displays correct data",
"View profile when not logged in - redirects to login",
"View non-existent profile - shows 404",
"Profile loads with avatar - image displayed",
"Profile loads without avatar - shows default"
]
},
"edit-profile.spec.ts": {
"tests": 8,
"scenarios": [
"Edit profile with valid data - saves successfully",
"Edit name to empty string - shows validation error",
"Edit email to invalid format - shows validation error",
"Edit email to existing email - shows uniqueness error",
"Bio exceeds 500 chars - shows validation error",
"Cancel edit - discards changes",
"Edit profile when not logged in - redirects",
"Optimistic update - UI updates immediately"
]
},
"upload-avatar.spec.ts": {
"tests": 6,
"scenarios": [
"Upload valid image (jpg) - succeeds and displays",
"Upload valid image (png) - succeeds and displays",
"Upload file >5MB - shows error",
"Upload non-image file - shows error",
"Upload image then cancel - reverts to previous",
"Visual regression - avatar displays correctly"
]
}
},
"page_objects": {
"ProfileViewPage": {
"selectors": {
"avatar": "[data-testid='profile-avatar']",
"name": "[data-testid='profile-name']",
"email": "[data-testid='profile-email']",
"bio": "[data-testid='profile-bio']",
"editButton": "[data-testid='edit-profile-btn']"
},
"methods": [
"isDisplayed()",
"getDisplayedName()",
"clickEditButton()"
]
},
"ProfileEditPage": {
"selectors": {
"nameInput": "[data-testid='input-name']",
"emailInput": "[data-testid='input-email']",
"bioInput": "[data-testid='input-bio']",
"avatarUpload": "[data-testid='avatar-upload']",
"saveButton": "[data-testid='save-profile-btn']",
"cancelButton": "[data-testid='cancel-btn']"
},
"methods": [
"fillName(name: string)",
"fillEmail(email: string)",
"fillBio(bio: string)",
"uploadAvatar(filePath: string)",
"clickSave()",
"clickCancel()"
]
}
},
"test_coverage": {
"total_scenarios": 19,
"happy_path": 7,
"error_cases": 10,
"edge_cases": 2
}
},
"test_data": {
"test_users": [
{
"id": "test-user-1",
"name": "Alice Johnson",
"email": "alice@example.com",
"bio": "Software engineer and coffee enthusiast",
"avatar_url": null
},
{
"id": "test-user-2",
"name": "Bob Smith",
"email": "bob@example.com",
"bio": null,
"avatar_url": "https://example.com/avatars/bob.jpg"
}
]
},
"assumptions": {
"frontend": "React components render expected data-testid attributes",
"backend": "API returns expected error codes (400, 401, 404)",
"auth": "Test users can authenticate with JWT tokens"
},
"context_summary": "Created 19 E2E test scenarios with Playwright covering profile view, edit, and avatar upload. Page Object Model pattern for maintainability. Tests ready to run once frontend and backend integrated."
}
```
**File**: `.claude/context/user-profile-feature-20250115-tests.json`
**Execution Time**: 50 minutes
---
## Phase 3: Merge Parallel Results
**Agent**: Orchestrator
**Duration**: 5 minutes
**Purpose**: Merge contexts from 3 parallel tasks
### Merged Context
```json
{
"version": "1.0",
"workflow_id": "user-profile-feature-20250115",
"timestamp": "2025-01-15T10:10:00Z",
"current_agent": "orchestrator",
"next_agent": "integration-verifier",
"phase": "parallel-complete-merge",
"feature_spec": {
"name": "User Profile Management",
"status": "implementation-complete"
},
"parallel_execution_summary": {
"started_at": "2025-01-15T09:05:00Z",
"completed_at": "2025-01-15T10:05:00Z",
"total_duration_minutes": 60,
"tasks": [
{
"task_id": "frontend-impl",
"agent": "react-tanstack-developer",
"duration_minutes": 45,
"status": "completed",
"files_count": 8,
"test_coverage": "87%"
},
{
"task_id": "backend-impl",
"agent": "tdd-python-developer",
"duration_minutes": 60,
"status": "completed",
"files_count": 6,
"test_coverage": "94%"
},
{
"task_id": "test-impl",
"agent": "playwright-tester",
"duration_minutes": 50,
"status": "completed",
"files_count": 5,
"test_coverage": "100% (all scenarios covered)"
}
]
},
"files_modified": [
"src/routes/profile/index.tsx",
"src/routes/profile/edit.tsx",
"src/components/ProfileView.tsx",
"src/components/ProfileEdit.tsx",
"src/components/AvatarUpload.tsx",
"src/lib/validation/profile-schema.ts",
"tests/components/ProfileView.test.tsx",
"tests/components/ProfileEdit.test.tsx",
"src/api/routes/profile.py",
"src/models/user.py",
"src/schemas/profile.py",
"tests/api/test_profile.py",
"tests/integration/test_profile_flow.py",
"alembic/versions/003_add_bio_to_users.py",
"e2e/profile/view-profile.spec.ts",
"e2e/profile/edit-profile.spec.ts",
"e2e/profile/upload-avatar.spec.ts",
"e2e/fixtures/test-users.json",
"e2e/utils/profile-helpers.ts"
],
"decisions": [
"Frontend: TanStack Query + Form, Zod validation, optimistic updates",
"Backend: FastAPI, Pydantic v2, SQLModel ORM, JWT auth",
"Storage: Cloudflare R2 for avatars with presigned URLs",
"Testing: Playwright E2E with Page Object Model",
"Rate limiting: 10 profile updates per hour per user"
],
"pending_actions": [
"Integration verification (API contract alignment)",
"Run full test suite (unit + integration + E2E)",
"Configure R2 bucket in production",
"Run database migration in staging",
"Update API base URL in frontend production config",
"Add CORS configuration for frontend domain",
"Deploy to staging for final validation"
],
"integration_concerns": [
{
"concern": "API contract alignment",
"frontend_expects": "GET /api/profile/:userId returns { id, name, email, bio?, avatar_url? }",
"backend_provides": "ProfileResponse with matching fields",
"status": "aligned"
},
{
"concern": "Error code handling",
"frontend_expects": "400, 401, 404 error codes",
"backend_provides": "400, 401, 404 as documented",
"status": "aligned"
},
{
"concern": "Avatar upload flow",
"frontend_expects": "POST /api/profile/:userId/avatar with multipart form",
"backend_provides": "Endpoint with multipart form support",
"status": "aligned"
}
],
"metrics": {
"total_files_modified": 19,
"total_test_coverage": "91% average",
"development_time": "60 minutes parallel (vs 155 minutes sequential)",
"speedup": "2.6x faster"
},
"context_summary": "Successfully merged 3 parallel development tracks (frontend, backend, E2E tests). All implementations complete with 91% average test coverage. API contracts aligned. Ready for integration verification and deployment to staging."
}
```
**File**: `.claude/context/user-profile-feature-20250115.json` (updated)
---
## Phase 4: Integration Verification
**Agent**: Integration Verifier
**Duration**: 15 minutes
**Purpose**: Verify all pieces work together
### Final Context Save
```json
{
"version": "1.0",
"workflow_id": "user-profile-feature-20250115",
"timestamp": "2025-01-15T10:25:00Z",
"current_agent": "integration-verifier",
"next_agent": null,
"phase": "integration-verified-ready-for-deployment",
"verification_results": {
"api_contract_alignment": {
"status": "passed",
"checks": [
"✅ GET /api/profile/:userId response matches frontend expectations",
"✅ PUT /api/profile/:userId request/response aligned",
"✅ POST /api/profile/:userId/avatar matches frontend upload",
"✅ Error codes (400, 401, 404) handled correctly"
]
},
"test_execution": {
"status": "passed",
"results": {
"unit_tests": "46/46 passed (100%)",
"integration_tests": "10/10 passed (100%)",
"e2e_tests": "19/19 passed (100%)"
},
"total": "75/75 tests passed (100%)"
},
"performance": {
"status": "passed",
"measurements": {
"GET /api/profile": "P50: 42ms, P95: 78ms, P99: 95ms ✅ (target <100ms)",
"PUT /api/profile": "P50: 105ms, P95: 185ms, P99: 220ms ✅ (target <200ms)",
"POST /api/profile/avatar": "P50: 780ms, P95: 1350ms, P99: 1680ms ✅ (target <2000ms)"
}
},
"security": {
"status": "passed",
"checks": [
"✅ JWT authentication on all endpoints",
"✅ Permission checks prevent cross-user access",
"✅ Email validation and sanitization",
"✅ File upload validation (type, size)",
"✅ Rate limiting configured",
"✅ CORS restricted to allowed origins",
"✅ No secrets in frontend code"
]
},
"database_migration": {
"status": "completed",
"migration": "003_add_bio_to_users",
"applied_to": ["development", "staging"],
"pending": ["production"]
}
},
"deployment_readiness": {
"staging": {
"status": "deployed",
"url": "https://staging.example.com/profile",
"deployed_at": "2025-01-15T10:20:00Z",
"validation": "All E2E tests passed on staging"
},
"production": {
"status": "ready",
"prerequisites": [
"✅ All tests passing",
"✅ Code reviewed and approved",
"✅ Security audit completed",
"✅ Performance benchmarks met",
"⏳ Run database migration (manual step)",
"⏳ Configure R2 bucket (manual step)",
"⏳ Deploy to production (manual step)"
]
}
},
"pending_actions": [
"Run production database migration: alembic upgrade head",
"Configure Cloudflare R2 bucket: cloudflare-r2-avatars",
"Set production environment variables (R2 credentials, CORS origin)",
"Deploy backend to production",
"Deploy frontend to production",
"Monitor production metrics for 24 hours",
"Create user documentation for profile feature"
],
"context_summary": "Integration verified successfully. All 75 tests passing. Performance targets met. Security audit passed. Deployed to staging and validated. Ready for production deployment after manual configuration steps (database migration, R2 bucket setup)."
}
```
**File**: `.claude/context/user-profile-feature-20250115.json` (final)
---
## Workflow Metrics
### Time Comparison
| Phase | Sequential | Parallel | Speedup |
|-------|-----------|----------|---------|
| Design & Planning | 5 min | 5 min | 1.0x |
| Frontend Implementation | 45 min | 45 min | 1.0x (parallel) |
| Backend Implementation | 60 min | 60 min | 1.0x (parallel) |
| E2E Test Implementation | 50 min | 50 min | 1.0x (parallel) |
| **Development Total** | **160 min** | **60 min** | **2.7x** |
| Integration & Verification | 15 min | 15 min | 1.0x |
| **Overall Total** | **180 min** | **80 min** | **2.25x** |
**Savings**: 100 minutes (1 hour 40 minutes)
---
### Context Size Progression
| Phase | Context Size | Files Modified |
|-------|-------------|----------------|
| Initial (Parent) | 2.1 KB | 0 |
| Frontend (Child) | 4.8 KB | 8 |
| Backend (Child) | 6.2 KB | 6 |
| E2E Tests (Child) | 5.1 KB | 5 |
| **Merged** | **12.5 KB** | **19** |
| Final (Verified) | 8.9 KB | 19 |
**Optimization**: Merged context pruned conversation history and redundant data, reducing from 12.5 KB to 8.9 KB (29% reduction).
---
### Test Coverage
| Track | Unit Tests | Integration Tests | E2E Tests | Coverage |
|-------|-----------|------------------|-----------|----------|
| Frontend | 2 suites | - | - | 87% |
| Backend | 18 tests | 10 tests | - | 94% |
| E2E Tests | - | - | 19 scenarios | 100% |
| **Total** | **20** | **10** | **19** | **91% avg** |
---
## Key Takeaways
### Parallel Execution Benefits
**2.25x faster** than sequential execution
**Independent work streams** - no blocking between frontend, backend, tests
**Early issue detection** - E2E tests identified API contract assumptions early
**Higher quality** - Each agent focused deeply on their domain
### Context Management Insights
**Context Size**: Parallel contexts were larger overall (total ~16 KB vs sequential ~8 KB), but merge reduced redundancy to 8.9 KB.
**Context Merge Strategy**:
- Union of `files_modified` (no duplicates)
- Concatenate `decisions` from all tasks
- Merge `pending_actions` with deduplication
- Aggregate `error_log` from all tasks
**Handoff Points**:
1. Parent → 3 parallel children (split)
2. 3 parallel children → parent (merge)
3. Parent → integration verifier (sequential)
### Challenges and Solutions
**Challenge 1**: API contract alignment between frontend and backend
**Solution**: Defined explicit API contract assumptions in parent context. Integration verifier validated alignment.
**Challenge 2**: Test data coordination across E2E tests and backend
**Solution**: Shared test user fixtures in parent context. Backend seeded database with test data.
**Challenge 3**: Avatar upload implementation depends on R2 configuration
**Solution**: Documented R2 setup as prerequisite in parent context. Used local file storage for development.
---
## Usage Guide
### When to Use Parallel Execution
**Use parallel when**:
- Tasks are independent (minimal dependencies)
- Different agents/skill sets required
- Time-critical delivery
- Multiple subsystems (frontend, backend, database, tests)
**Don't use parallel when**:
- Tasks have sequential dependencies
- Shared resources with locking concerns
- Single agent can handle all work efficiently
- Coordination overhead > time savings
### Scaling to More Tasks
This example showed 3 parallel tasks. Practical limits:
- **3-5 tasks**: Optimal parallelism (diminishing returns after)
- **6-10 tasks**: Requires careful orchestration, higher merge complexity
- **10+ tasks**: Consider hierarchical parallelism (parent spawns sub-parents)
---
**Example Complexity**: Medium-High
**Lines of Code**: ~2000 across 19 files
**Total Tests**: 75 (20 unit, 10 integration, 19 E2E)
**Success Rate**: 100% (all tests passing)
**Production Ready**: Yes (after manual config steps)