Idle Rampage

A React Native mobile game demonstrating complex game system design, state management patterns, and mobile-specific optimizations.

Architecture Overview

The game uses an ECS-inspired (Entity Component System) architecture with 11 specialized game systems. Each system handles one aspect of game logic and communicates through a central event bus.

GameLoop (60 tick/sec)
    |
    +-- CombatSystem      (damage calculations)
    +-- ProductionSystem  (resource generation)
    +-- WaveManager       (enemy spawning)
    +-- PrestigeSystem    (progression reset)
    +-- OfflineProgress   (away earnings)
    +-- DailyRewards      (login streaks)
    +-- LuckyDrops        (random bonuses)
    +-- WorkerEfficiency  (building modifiers)
    +-- SpecialEffects    (visual feedback)
    +-- BuilderManager    (construction queue)
    +-- SaveManager       (persistence)

State Management

Zustand Store - Single source of truth for all game state. Zustand was chosen over Redux for its minimal boilerplate and native async support. The store structure:

interface GameState {
  // Resources
  scrap: number;
  blueprints: number;

  // Buildings (keyed by building ID)
  buildings: Record<string, BuildingState>;

  // Combat
  currentWave: number;
  enemyHP: number;
  enemyMaxHP: number;

  // Prestige
  prestigeLevel: number;
  permanentUpgrades: Record<string, number>;

  // Meta
  lastSaveTime: number;
  totalPlayTime: number;
}

Persistence - AsyncStorage serializes game state on every save (auto-save every 30 seconds + on app background). Save files are versioned for migration support when game balance changes.

Game Balance & Formulas

Enemy HP Scaling - Exponential growth with boss multipliers:

const baseHP = 100;
const growthRate = 1.15;
const bossMultiplier = wave % 10 === 0 ? 5 : 1;
const hp = baseHP * Math.pow(growthRate, wave) * bossMultiplier;
// Wave 1: 100 HP
// Wave 50: ~108,000 HP
// Wave 100 (boss): ~2,500,000 HP

Building Costs - Soft exponential with diminishing returns:

const baseCost = buildingData.baseCost;
const costMultiplier = 1.12;
const cost = baseCost * Math.pow(costMultiplier, level);

Prestige Blueprint Formula - Based on highest wave reached:

const blueprints = Math.floor(Math.pow(highestWave / 10, 1.5));

Animation System

react-native-reanimated - All animations run on the UI thread via worklets, ensuring 60fps even during intense combat. Key animations:
- Enemy health bar (interpolated width)
- Damage numbers (spring physics, fade out)
- Building construction (scale + rotation)
- Wave clear celebration (particle burst)

Performance Optimizations:
- Damage numbers pooled and recycled (max 20 active)
- Enemy sprites use shared animated values
- Building renders memoized with React.memo
- Game loop uses requestAnimationFrame for consistent timing

Testing Strategy

1,114 Jest Tests covering:
- Unit tests for all game formulas
- Integration tests for system interactions
- Snapshot tests for component rendering
- Edge cases (wave 100, max prestige, overflow scenarios)

Test structure mirrors src/ directory:

tests/
  systems/
    CombatSystem.test.ts
    WaveManager.test.ts
    ...
  stores/
    gameStore.test.ts
  data/
    buildingData.test.ts
    balanceFormulas.test.ts

Mobile-Specific Features

• iOS/Android parity - Identical behavior on both platforms
• Safe area handling - UI respects notches and home indicators
• Background detection - Triggers auto-save when app backgrounds
• In-app purchases - Optional cosmetics via react-native-iap
• No network required - Fully offline-capable