claude-skills/engineering-team/skills/tech-stack-evaluator/references/examples.md

Technology Evaluation Examples

Concrete examples showing input formats and expected outputs.

---

Table of Contents

• Quick Comparison Example
• TCO Analysis Example
• Ecosystem Analysis Example
• Migration Assessment Example
• Multi-Technology Comparison

---

Quick Comparison Example

Input (Text Format)

Compare React vs Vue for building a SaaS dashboard.
Focus on: developer productivity, ecosystem maturity, performance.

Output

TECHNOLOGY COMPARISON: React vs Vue for SaaS Dashboard
=======================================================

RECOMMENDATION: React
Confidence: 78% (Medium-High)

COMPARISON MATRIX
-----------------
| Category             | Weight | React | Vue  |
|----------------------|--------|-------|------|
| Performance          | 15%    | 82.0  | 85.0 |
| Scalability          | 15%    | 88.0  | 80.0 |
| Developer Experience | 20%    | 85.0  | 90.0 |
| Ecosystem            | 15%    | 92.0  | 78.0 |
| Learning Curve       | 10%    | 70.0  | 85.0 |
| Documentation        | 10%    | 88.0  | 82.0 |
| Community Support    | 10%    | 90.0  | 75.0 |
| Enterprise Readiness | 5%     | 85.0  | 72.0 |
|----------------------|--------|-------|------|
| WEIGHTED TOTAL       | 100%   | 85.2  | 81.1 |

KEY DECISION FACTORS
--------------------
1. Ecosystem (15%): React leads with 92.0 - larger npm ecosystem
2. Developer Experience (20%): Vue leads with 90.0 - gentler learning curve
3. Community Support (10%): React leads with 90.0 - more Stack Overflow resources

PROS/CONS SUMMARY
-----------------
React:
  ✓ Excellent ecosystem (92.0/100)
  ✓ Strong community support (90.0/100)
  ✓ Excellent scalability (88.0/100)
  ✗ Steeper learning curve (70.0/100)

Vue:
  ✓ Excellent developer experience (90.0/100)
  ✓ Good performance (85.0/100)
  ✓ Easier learning curve (85.0/100)
  ✗ Smaller enterprise presence (72.0/100)

---

TCO Analysis Example

Input (JSON Format)

{
  "technology": "Next.js on Vercel",
  "team_size": 8,
  "timeline_years": 5,
  "initial_costs": {
    "licensing": 0,
    "training_hours_per_dev": 24,
    "developer_hourly_rate": 85,
    "migration": 15000,
    "setup": 5000
  },
  "operational_costs": {
    "monthly_hosting": 2500,
    "annual_support": 0,
    "maintenance_hours_per_dev_monthly": 16
  },
  "scaling_params": {
    "initial_users": 5000,
    "annual_growth_rate": 0.40,
    "initial_servers": 3,
    "cost_per_server_monthly": 150
  }
}

Output

TCO ANALYSIS: Next.js on Vercel (5-Year Projection)
====================================================

EXECUTIVE SUMMARY
-----------------
Total TCO: $1,247,320
Net TCO (after productivity gains): $987,320
Average Yearly Cost: $249,464

INITIAL COSTS (One-Time)
------------------------
| Component      | Cost      |
|----------------|-----------|
| Licensing      | $0        |
| Training       | $16,820   |
| Migration      | $15,000   |
| Setup          | $5,000    |
|----------------|-----------|
| TOTAL INITIAL  | $36,820   |

OPERATIONAL COSTS (Per Year)
----------------------------
| Year | Hosting  | Maintenance | Total     |
|------|----------|-------------|-----------|
| 1    | $30,000  | $130,560    | $160,560  |
| 2    | $42,000  | $130,560    | $172,560  |
| 3    | $58,800  | $130,560    | $189,360  |
| 4    | $82,320  | $130,560    | $212,880  |
| 5    | $115,248 | $130,560    | $245,808  |

SCALING ANALYSIS
----------------
User Projections: 5,000 → 7,000 → 9,800 → 13,720 → 19,208
Cost per User: $32.11 → $24.65 → $19.32 → $15.52 → $12.79
Scaling Efficiency: Excellent - economies of scale achieved

KEY COST DRIVERS
----------------
1. Developer maintenance time ($652,800 over 5 years)
2. Infrastructure/hosting ($328,368 over 5 years)

OPTIMIZATION OPPORTUNITIES
--------------------------
• Consider automation to reduce maintenance hours
• Evaluate reserved capacity pricing for hosting

---

Ecosystem Analysis Example

Input

technology: "Svelte"
github:
  stars: 78000
  forks: 4100
  contributors: 680
  commits_last_month: 45
  avg_issue_response_hours: 36
  issue_resolution_rate: 0.72
  releases_per_year: 8
  active_maintainers: 5
npm:
  weekly_downloads: 420000
  version: "4.2.8"
  dependencies_count: 0
  days_since_last_publish: 21
community:
  stackoverflow_questions: 8500
  job_postings: 1200
  tutorials_count: 350
  forum_members: 25000
corporate_backing:
  type: "community_led"
  funding_millions: 0

Output

ECOSYSTEM ANALYSIS: Svelte
==========================

OVERALL HEALTH SCORE: 71.5/100

HEALTH SCORE BREAKDOWN
----------------------
| Category           | Score | Assessment        |
|--------------------|-------|-------------------|
| GitHub Health      | 78.0  | Strong            |
| npm Health         | 72.0  | Good              |
| Community Health   | 58.0  | Moderate          |
| Corporate Backing  | 40.0  | Community-led     |
| Maintenance Health | 75.0  | Active            |

VIABILITY ASSESSMENT
--------------------
Overall: Good - Solid viability with minor concerns
Risk Level: Low-Medium

Strengths:
• Strong GitHub presence with active community
• Active maintenance with responsive issue resolution
• High npm adoption with stable releases

Risks:
• Weak corporate backing - sustainability concerns
• Smaller community - limited enterprise resources

RECOMMENDATION
--------------
Suitable for adoption - monitor corporate backing situation.
Consider alternative with stronger backing for mission-critical enterprise apps.

KEY METRICS
-----------
GitHub: 78,000 stars, 680 contributors, 45 commits/month
npm: 420,000 weekly downloads, v4.2.8
Community: 8,500 SO questions, 1,200 job postings

---

Migration Assessment Example

Input

Assess migration from Angular.js (1.x) to React.
Application: 50,000 lines of code, 200 components.
Team: 6 developers, 2 have React experience.
Timeline: Need completion within 8 months.

Output

MIGRATION ASSESSMENT: Angular.js 1.x → React
=============================================

COMPLEXITY SCORE: 7.8/10 (High)

COMPLEXITY BREAKDOWN
--------------------
| Factor              | Score | Impact      |
|---------------------|-------|-------------|
| Code Changes        | 8/10  | 50K LOC     |
| Architecture Impact | 9/10  | Complete    |
| Data Migration      | 5/10  | State only  |
| Downtime Risk       | 6/10  | Mitigatable |

EFFORT ESTIMATION
-----------------
| Phase                    | Hours  | Duration |
|--------------------------|--------|----------|
| Planning & Prototyping   | 240    | 3 weeks  |
| Core Migration           | 2,400  | 16 weeks |
| Testing & Validation     | 480    | 5 weeks  |
| Deployment & Monitoring  | 160    | 2 weeks  |
|--------------------------|--------|----------|
| TOTAL                    | 3,280  | 26 weeks |

Timeline Assessment: 26 weeks exceeds 8-month target (32 weeks)
Recommendation: Feasible with buffer

RISK ASSESSMENT
---------------
Technical Risks:
• High - Two-way binding to unidirectional data flow
• Medium - Dependency injection to hooks/context
• Medium - Performance regression during transition

Business Risks:
• Medium - Feature freeze during migration
• Low - Customer impact with phased approach

Team Risks:
• High - 4 of 6 developers need React training
• Medium - Learning curve affects velocity initially

MIGRATION STRATEGY
------------------
Recommended Approach: Strangler Fig Pattern

Phase 1 (Weeks 1-8): Strangler setup
• Create React shell application
• Set up micro-frontend routing
• Migrate shared utilities

Phase 2 (Weeks 9-18): Component migration
• Migrate components by feature area
• Maintain Angular.js for untouched areas
• Continuous integration testing

Phase 3 (Weeks 19-24): Completion
• Migrate remaining components
• Remove Angular.js dependencies
• Performance optimization

Phase 4 (Weeks 25-26): Stabilization
• Production deployment
• Monitoring and fixes

---

Multi-Technology Comparison

Input

Compare: React, Vue, Svelte, Angular for enterprise SaaS.
Use case: Large team (20+ developers), complex state management.
Generate comprehensive decision matrix.

Output

MULTI-TECHNOLOGY COMPARISON: Enterprise SaaS Platform
======================================================

RECOMMENDATION: React
Confidence: 72% (Medium)
Runner-up: Angular (close second for enterprise)

DECISION MATRIX
---------------
| Category             | Wt   | React | Vue  | Svelte | Angular |
|----------------------|------|-------|------|--------|---------|
| Performance          | 15%  | 82    | 85   | 95     | 78      |
| Scalability          | 15%  | 90    | 82   | 75     | 92      |
| Developer Experience | 20%  | 85    | 90   | 88     | 75      |
| Ecosystem            | 15%  | 95    | 80   | 65     | 88      |
| Learning Curve       | 10%  | 70    | 85   | 80     | 60      |
| Documentation        | 10%  | 90    | 85   | 75     | 92      |
| Community Support    | 10%  | 92    | 78   | 55     | 85      |
| Enterprise Readiness | 5%   | 88    | 72   | 50     | 95      |
|----------------------|------|-------|------|--------|---------|
| WEIGHTED TOTAL       | 100% | 86.3  | 83.1 | 76.2   | 83.0    |

FRAMEWORK PROFILES
------------------
React: Best for large ecosystem, hiring pool
Angular: Best for enterprise structure, TypeScript-first
Vue: Best for developer experience, gradual adoption
Svelte: Best for performance, smaller bundles

RECOMMENDATION RATIONALE
------------------------
For 20+ developer team with complex state management:

1. React (Recommended)
   • Largest talent pool for hiring
   • Extensive enterprise libraries (Redux, React Query)
   • Meta backing ensures long-term support
   • Most Stack Overflow resources

2. Angular (Strong Alternative)
   • Built-in structure for large teams
   • TypeScript-first reduces bugs
   • Comprehensive CLI and tooling
   • Google enterprise backing

3. Vue (Consider for DX)
   • Excellent documentation
   • Easier onboarding
   • Growing enterprise adoption
   • Consider if DX is top priority

4. Svelte (Not Recommended for This Use Case)
   • Smaller ecosystem for enterprise
   • Limited hiring pool
   • State management options less mature
   • Better for smaller teams/projects