Skip to content

ttrang87/trafficflow-frontend

Repository files navigation

🚦 Traffic Simulation System

Real-time traffic intersection simulation with intelligent vehicle behavior, collision-free operation, and interactive monitoring


🚀 Overview

This project demonstrates advanced Java multithreading and real-time system design by simulating a complex traffic intersection. The system manages 70+ concurrent vehicles across multiple lanes with emergency vehicle priority, achieving 100% safety through advanced lane filtering, vehicle behaviors, safe-distance management, and emergency vehicle priority.

Production: https://trafficflow-orpin.vercel.app/

Backend Repo: https://github.com/ttrang87/trafficflow-backend


🎥 Demo

image

Traffic Simulation Demo


⚡ Key Features

🚥 Traffic Infrastructure

  • Smart Traffic Lights: 4 traffic lights with automatic timing control
  • Multi-Lane System: 24 lanes (8 outbound lanes, 8 inbound lanes, center area, 8 emergency lanes)
  • Intersection Management: Complex routing with lane filtering and safe distance control

🚗 Vehicle System

Vehicle Categories (3 Types with special speed and size):

  • Normal Cars: Ford, Toyota, Audi, Honda, Minivan
  • Delivery Vehicles
  • Emergency Vehicles (Ambulances, Fire Trucks, Police)

Intelligent Behavior:

  • Dynamic speed adjustment based on traffic conditions
  • Safe distance maintenance between vehicles
  • Lane switching with binary search optimization
  • Emergency vehicle priority with automatic traffic light pause and priority lanes
  • 100% Collision Prevention: Advanced safety algorithms ensuring zero accidents

🎛️ Control Panel

Real-Time Monitoring:

  • Live Traffic Analytics: Vehicle count and flow efficiency tracking (average wait time and speed)
  • Emergency Notifications: Instant alerts for emergency vehicle activity

Simulation Controls:

  • Playback Control: Start, pause, and reset simulation
  • Speed Modes: 3 adjustable simulation speeds
  • Density Control: Dynamic traffic load adjustment
  • Traffic Light Timing: Customizable signal duration

🛠️ Tech Stack

Backend Frontend Architecture
Java 24 React REST API
Spring Boot JavaScript WebSocket
Multithreading Canvas API Real-time Communication
WebSocket Tailwind CSS Thread-Safe Design

🏆 Technical Highlights

  • 🔥 High-Performance Processing: 2,100+ state updates per second
  • ⚡ Concurrent Architecture: 30+ threads with thread-safe synchronization
  • 📡 Real-Time Communication: WebSocket integration for instant state updates
  • 🧠 Advanced Algorithms: Binary search lane optimization
  • 🛡️ Zero Race Conditions: Robust thread safety implementation

🚀 Quick Start

# Backend
cd backend && mvn spring-boot:run

# Frontend  
cd frontend && npm install && npm start

🌐 Visit http://localhost:5173 to start the traffic simulation.


💡 Technical Achievements

Metric Achievement
Concurrent Entities 70+ vehicles managed simultaneously
Safety Record 100% collision-free operation
Performance 2100+ updates per second
Thread Safety Zero race conditions and deadlocks
Emergency Response Automated traffic light pause and priority lanes

🎯 Why This Project?

Built to demonstrate production-level concurrent programming and real-time system design skills:

  • System Design: Multi-component real-time architecture
  • Concurrent Programming: Safe multithreading with Java
  • Performance Engineering: Optimized state management
  • Real-World Problem Solving: Complex traffic behavior modeling

💼 Showcases software engineering skills for production-ready development roles

About

Traffic Simulation with Java and React

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

 
 
 

Contributors

Languages