mirror of
https://github.com/tiennm99/rplace.git
synced 2026-05-27 04:01:58 +00:00
fc49de154a
- README: features, architecture diagram, setup guide, API reference, configuration table, project structure - docs/system-architecture.md: data flow, storage design, rate limiting - docs/code-standards.md: conventions, project layout, API format - docs/deployment-guide.md: step-by-step CF Workers + Upstash deploy
51 lines
1.7 KiB
Markdown
51 lines
1.7 KiB
Markdown
# 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
|