Vibect-Democraticmusicstreamingforeveryone

Vibect is an innovative, open-source music streaming platform designed to democratize the listening experience. Moving beyond traditional, centralized models, Vibect empowers communities to collectively curate their soundtracks through real-time voting. Whether in a public space or a private circle, users can add songs from YouTube and engage in a dynamic, democratic process where the community decides what plays next.

#How it works

At its core, Vibect combines a modern, responsive user interface with a robust, real-time backend. Users can create or join "spaces," which function as shared listening rooms. Within these spaces, participants can search for and add songs from YouTube. The magic happens through a live voting system where every user can upvote or downvote queued tracks. The platform's architecture ensures that these votes are registered instantly, and the playlist is dynamically reordered to reflect the community's preferences. This creates a living, breathing soundtrack that evolves with the collective will of the listeners.

#Features

Core Functionality

• Democratic Queue Management - Songs automatically rank based on community votes.
• Real-time Playback Synchronization - ±60ms accuracy across all clients using custom NTP protocol.
• Space Management - Create unlimited public or private music spaces.
• YouTube Integration - Add any song via simple YouTube links.
• Vote System - Upvote/downvote songs with instant queue updates.
• Live Member Presence - See who's listening in real-time.

Technical Highlights

• Distributed Real-time Architecture - WebSocket-based with Redis pub/sub for horizontal scaling.
• Custom NTP Time Sync - Server-authoritative timing ensures perfect playback sync.
• Type-safe End-to-End - Full TypeScript coverage from database to UI.
• Optimistic UI Updates - Instant feedback with automatic rollback on errors.
• Production-grade Caching - Redis-based caching layer for optimal performance.
• Rate Limiting & Security - Protected against abuse with Fastify rate limiting.

Monorepo Architecture

• Turborepo - High-performance build system
• pnpm - Fast, disk-efficient package manager

Frontend (apps/web)

• Next.js 14 - React framework with App Router
• TypeScript - Type safety
• Tailwind CSS - Utility-first styling
• shadcn/ui - Beautiful, accessible components
• Socket.io Client - WebSocket communication

Backend (apps/api)

• Fastify - High-performance web framework
• WebSocket (ws) - Real-time bidirectional communication
• Prisma - Next-generation ORM
• Redis - Caching and pub/sub messaging
• Supabase Auth - Authentication provider

Database & Infrastructure

• PostgreSQL - Primary database (via Supabase)
• Redis - Caching layer and pub/sub (via Upstash)
• Prisma - Type-safe database client

DevOps & Monitoring

• Docker - Containerization
• Vitest - Unit testing framework
• Pino - High-performance logging

#System Architecture Deep Dive

1. NTP-Inspired Time Synchronization

The most technically impressive feature is the playback synchronization across all clients:

// Client calculates server time offset
const offset = serverTimestamp - clientTimestamp - (roundTripTime / 2)
const serverTime = Date.now() + offset

// Calculate exact playback position
const position = (serverTime - startedAt) * playbackRate

Accuracy: Engineered an NTP-inspired clock sync with avg offset correction of 60ms cross-continent (India→US); sub-5ms on local network. Enabling near-instant play/pause, skip actions across clients in a shared space.

2. Hybrid Real-time Layer (Redis + WebSocket)

// Redis Pub/Sub for room broadcasts
const subscriber = redis.duplicate()
subscriber.subscribe('space:xyz:events', (message) => {
  // handle event
})

// WebSocket for WebSocket-only clients
const wss = new WebSocketServer({ server })
wss.on('connection', (ws) => {
  // handle client
})

Scalability: horizontally scalable with multiple API instances behind a Redis pub/sub fan-out layer; Redis handles 10K+ concurrent room broadcasts efficiently.

┌─────────┐      ┌─────────┐      ┌─────────┐
│ Server1 │────▶│  Redis  │◀────│ Server2 │
└─────────┘      │ Pub/Sub │      └─────────┘
      │          └─────────┘           │
      ▼                                ▼
  [Clients]                        [Clients]

Latency: Load tested WebSocket sync system with k6 across 50 concurrent connections — maintained 100% message delivery across 2000+ TIME SYNC exchanges with zero failures; p99 RTT of 9ms on local network and sub-350ms median on cross-continent deployment (India → US).

3. Distributed Vote Aggregation

Votes are processed through a carefully designed pipeline:

Votes flow through a carefully designed pipeline:

• 1. Optimistic UI Update: Client immediately reflects the vote.
• 2. Database Transaction: Atomic upsert prevents race conditions.
• 3. Redis Pub/Sub: Broadcasts vote to all connected servers.
• 4. WebSocket Broadcast: All clients in the space receive the update.
• 5. Queue Recalculation: Songs reordered based on new vote totals.

#Performance Metrics

• WebSocket Latency: p99 RTT of 9ms local Network; sub-350ms cross-continent (India → US).
• Time Sync Accuracy: avg 60ms cross-continent (India → US); sub-5ms local network.
• Vote Processing: < 100ms end-to-end
• Queue Update: Real-time (< 200ms)
• Concurrent Users per Space: Tested with 100+ concurrent users on k6 load testing.
• Message Delivery: 100% message delivery across 2000+ TIME SYNC exchanges with zero failures.