rplace/docs/code-standards.md

Code Standards

Language & Style

• JavaScript (ES modules, no TypeScript)
• Svelte 5 with runes ($state, $props, $derived, $effect)
• kebab-case for JS files, PascalCase for Svelte components
• Files under 200 lines
• No semicolons omission — use semicolons consistently

Project Layout

src/
├── worker.js              # Worker entry (Hono routes)
├── durable-objects/       # Cloudflare Durable Objects
├── lib/                   # Shared libraries (worker + client)
├── client/                # Svelte SPA
│   ├── components/        # Svelte components (PascalCase)
│   ├── main.js            # Mount entry
│   └── App.svelte         # Root component
└── index.html             # Vite entry

Conventions

Worker (src/worker.js, src/lib/*)

• Functions receive env parameter for Cloudflare bindings (Redis credentials, DO bindings)
• No global state — Workers are stateless between requests
• Use @upstash/redis/cloudflare (REST-based, not TCP)
• Bitfield operations use builder pattern: redis.bitfield(key).set().exec()

Client (src/client/*)

• Svelte 5 runes only ($state, $props, $derived, $effect)
• No stores — pass state via props and callbacks
• Canvas rendering is imperative (OffscreenCanvas + putImageData)
• Touch and mouse handlers coexist on the same canvas element

Shared (src/lib/constants.js, src/lib/canvas-decoder.js)

• Imported by both worker and client
• Vite tree-shakes worker-only code from client bundle
• Constants are the single source of truth for canvas dimensions, colors, limits

API Response Format

Success: { ok: true, credits: N } Error: { error: "error_code", ...details } with appropriate HTTP status