Build Realistic 3D City Environment

I’m developing Delivery World, a cross-platform 3D delivery-simulation that already handles log-ins, vehicle purchasing (bicycle, motorcycle and super-motorcycle), mission flow, rewards, marketplace trading, ranking tables, maintenance/fuel, in-game ads and anti-cheat. What the project now needs is a living, breathing city that feels authentic on mobile, desktop and tablet browsers.

Scope
• Model and assemble a WebGL-ready city with varied districts, drivable streets, intersections and delivery hotspots, all optimised for quick browser loading and solid frame rates on mid-range phones.
• Populate the streets with AI-controlled traffic that obeys signals, yields and reacts believably to the player.
• Introduce interactive NPCs specifically themed as other delivery drivers. These NPCs must follow their own delivery routes, compete for pickups, and trigger contextual dialogues or mini-events when players cross paths.
• Provide hooks (JavaScript events or REST/WebSocket calls) so my existing gameplay code can query traffic density, spawn or despawn NPC drivers, and read basic state like location or speed.
• Supply cleanly organised project files, commented source, and a short setup document so future updates—warehouses, seasonal events, city expansion—slot in smoothly.

Acceptance criteria
1. Initial city scene loads in under 6 seconds on a typical 4G connection and maintains 50-60 FPS at 720p.
2. NPC delivery drivers and traffic share a single path-finding system; no obvious collisions or deadlocks during a 15-minute test run.
3. All assets compressed and atlased to keep total download below 40 MB.
4. Integration demo shows player-to-NPC interaction event firing successfully in a browser with no console errors.

Preferred toolchain is Three.js or Babylon.js, but if you have a different WebGPU/WebGL approach that meets the targets I’m open to it.