A real-time multiplayer blob game built with React, TypeScript, and WebGL. Players control blobs that can eat, split, and use power-ups while competing in various game modes.
- Real-time multiplayer blob control
- Power-up system with combos
- Team and FFA game modes
- Collision and physics system
- Dynamic obstacle interactions
- Trail and visual effects
- Leaderboard system
- WebGL rendering with PIXI.js
- WebSocket real-time communication
- Spatial partitioning for performance
- Dynamic quality management
- Memory-aware object pooling
- Mobile-responsive design
- Performance monitoring
- Error boundaries and recovery
- Frontend: React, TypeScript, PIXI.js, Tailwind CSS
- Backend: Node.js, Socket.IO
- State Management: Zustand
- Build Tools: Vite
- Animation: Framer Motion
- UI Components: Lucide React
- Node.js (v18 or higher)
- Conda (optional, for environment management)
Using Conda (recommended):
conda create -n blobby-env
conda activate blobby-envUsing npm directly:
npm install- Start the development server:
npm run dev- Start both client and server:
npm run dev:client
npm run dev:server- For production build:
npm run build
npm startThe game will be available at http://localhost:5173 (development) or http://localhost:3000 (production).
- FFA (Free-For-All): Every blob for themselves
- Teams: Collaborate with teammates to dominate
- Battle Royale: Coming soon!
- Mouse/Touch: Move blob
- Space: Split blob
- W: Boost
- X/Q: Eject mass
- 1-9: Activate power-ups
- Speed Boost
- Shield
- Mass Boost
- Ghost Mode
- Split Master
- And more!
- Core game mechanics and physics
- Real-time multiplayer infrastructure
- Power-up and combo system
- Performance optimizations
- Visual effects system
- Basic AI implementation
- Obstacle system
- Mobile optimization
- Team mode testing
- Battle royale mode
- Game mode selection UI
- Authentication system
- Database integration
- Advanced AI behaviors
- Tutorial system
- Tournament mode
- Achievement system
- Historical stats
The game includes several performance optimizations:
- Spatial hashing for collision detection
- Object pooling for particles and entities
- Batch rendering for similar objects
- Dynamic quality settings based on device capabilities
- Memory pressure handling
- Automatic quality scaling
- Mobile controls need further optimization
- High player count scenarios need testing
- Network performance under heavy load needs optimization
- PIXI.js team for the awesome rendering engine
- Socket.IO team for real-time communication
- React and TypeScript communities