Repocity — 3D GitHub Universe & Code Cityscape
Three.js procedural WebGL experience that transforms developer GitHub profiles and repositories into dynamic, living 3D metropolitan skylines with real-time stats.
Repocity :- Visualize your Github universe — Interface & System Overview
System Capabilities & Field Deployment Architecture
Live operational specifications, core architectural subsystems, and functional highlights verified across production environments.
Repocity is a 3D GitHub experience inspired by GitCity.
It transforms your profile into a living city where every repo becomes a building.
Your stats light up the skyline in real time.
You can explore, compare, and even duel with other developers.
Built to make your code feel alive.
Engineered Subsystem 01
InstancedMesh batching reduces GPU draw calls by over 80% compared to traditional meshes.
Engineered Subsystem 02
Procedural shader passes simulate night city lighting and neon tech stack reflections.
Engineered Subsystem 03
Edge-cached GitHub GraphQL proxies prevent API rate-limiting during viral traffic spikes.
Operational Constraint Resolved 01
Standard Three.js object instantiation creates hundreds of costly individual draw calls.
Operational Constraint Resolved 02
GitHub API rate limits block large-scale profile commit extraction without intelligent caching.
Operational Constraint Resolved 03
Mobile browser GPUs crash when rendering complex geometry without level-of-detail (LOD) systems.
Visualizing Sprawling Repository Histories Without GPU Meltdown
GitHub developer profiles are traditionally consumed as flat, uninspired 2D commit heatmaps and lists that fail to convey the true architectural scale and depth of a programmer's code contributions.
Generating hundreds of distinct 3D buildings representing individual repos, commit volumes, and code languages in real time can easily overwhelm browser WebGL contexts with excessive draw calls and memory leaks.
Standard Three.js object instantiation creates hundreds of costly individual draw calls.
GitHub API rate limits block large-scale profile commit extraction without intelligent caching.
Mobile browser GPUs crash when rendering complex geometry without level-of-detail (LOD) systems.
Instanced WebGL Meshes, Procedural City Shaders & Cached Graph Sync
Architected an instanced mesh rendering pipeline using Three.js and GSAP that combines all architectural geometries into batched draw calls, keeping frame rates locked at 60fps even with 500+ buildings on screen.
Mapped repository metrics directly to physical architecture: commit count governs building height, tech stack dictates skyscraper facade materials, and star counts illuminate rooftop beacons, with NextAuth and Supabase managing profile sync.
InstancedMesh batching reduces GPU draw calls by over 80% compared to traditional meshes.
Procedural shader passes simulate night city lighting and neon tech stack reflections.
Edge-cached GitHub GraphQL proxies prevent API rate-limiting during viral traffic spikes.
Structural Bill of Materials & Pipeline Flow
Execution Pipeline Sequence[ 01 → 05 ]
Production Benchmarks & Empirical Lab Test Plates
Smooth WebGL camera orbit rendering
Optimization via instanced mesh batching
Rapid procedural mesh construction
Simultaneous buildings supported in one skyline