Skip to main content
Back to Projects
complete 2026 web-applications

Code Evolution Analyzer

Visualize how code evolves over time by analyzing Git repository history with interactive charts and audio sonification.

View on GitHub Visit Website
Screenshot of Code Evolution Analyzer

Code Evolution Analyzer takes any public Git repository and creates an interactive visualization of how the codebase has evolved over time. Watch languages rise and fall, hear the composition change as sound, and explore the full history of any project.

How It Works

  1. Submit a public Git repository URL (GitHub, GitLab, Bitbucket, Codeberg, and more)
  2. Wait while workers clone the repository and analyze up to 2,000 commits
  3. View an interactive visualization with animated playback, language breakdowns, and optional audio

Features

  • Custom Canvas 2D renderer — Smooth 30fps animation with data decimation for large datasets
  • Audio sonification — Each language becomes a voice in an evolving chord; hear the code composition change
  • Real-time progress — WebSocket updates show cloning, analysis, and generation stages
  • Multiple metrics — View lines of code, file counts, or byte sizes
  • LRU repository cache — Repeat analyses are near-instant

Architecture

The web service uses a microservices architecture:

Browser (Lit + Tailwind)
    │ HTTP/WebSocket
    ▼
API Service (Express 5) ──NATS JetStream──▶ Worker(s)
    │                                          │
    ├───────────────PostgreSQL─────────────────┤
    │                                          │
    └───────────────Redis (Dragonfly)──────────┘
  • API Service — Express 5 REST API with WebSocket progress relay
  • Workers — Scalable job processors with heartbeat-based recovery
  • PostgreSQL — Job tracking, repository metadata, site statistics
  • Redis/Dragonfly — Caching layer for stats and deduplication
  • NATS JetStream — Durable job queue with at-least-once delivery

Technical Details

Built on scc (Sloc Cloc and Code) for fast code analysis—roughly 80x faster than traditional cloc for batch processing.

The CLI tool is a single 3,500-line JavaScript file that embeds the entire visualization (HTML, CSS, JS) as a template literal. No build step, no dependencies in the generated output.

The audio system uses Web Audio API with:

  • 16 oscillators tuned to a chord progression (I-V-vi-IV)
  • Perceptual gain scaling for audible minority languages
  • Stereo field separation for spatial distinction
  • Beat-synced drums for rhythmic structure

Articles