19.2.6
React
Component model and interactive browser interface for the landing page and puzzle room.
Under the table
Technologybehind this.
PieceTogether is a full-stack, server-authoritative multiplayer web app. This page records the real packages and versions in the current source manifest, explains how state survives between visits, and shows how OpenAI Sites delivers it—without publishing credentials or private infrastructure identifiers.
V1 architecture
- Application
- React + Vinext + TypeScript
- Compute
- Cloudflare Workers
- Database
- Cloudflare D1
- File storage
- Cloudflare R2
- Deployment
- OpenAI Sites
- Repository
- Private Sites-managed Git
Application stack
The code you interact with
These are the primary framework, language, UI and database packages pinned in the application manifest. Managed platform services are listed separately because their runtime versions are controlled by the hosting platform.
1.0.0-beta.5
Vinext
The Next.js-compatible application framework that turns the routes and server code into a Vite and Cloudflare build.
5.9.3
TypeScript
Strictly typed application, API, multiplayer-state and geometry code.
8.0.13
Vite
Development server, module pipeline and production bundler.
4.2.1
Tailwind CSS
Responsive layout, typography, color, interaction states and mobile adaptations.
0.45.2
Drizzle ORM
Typed database tooling included for relational schema and query workflows.
1.31.0
Lucide
Interface icons throughout the game and this technical guide.
16.29.0
Simple Icons
The trusted open brand-icon library used for the technology logos on this page.
Request path
From your finger to the shared table
The browser is deliberately not trusted as the final authority. Every meaningful action crosses the API boundary and is checked against the latest puzzle record before it is accepted.
Browser client
React interface, canvas-like workspaces, SVG piece masks, pointer and touch input.
Worker app + API
Vinext routes validate identity, locks, moves, snaps, progress and creator controls.
Durable services
D1 stores the authoritative puzzle record; R2 stores temporary uploaded originals.
Multiplayer model
Live-feeling, server-authoritative play
V1 uses short polling and presence heartbeats, not WebSockets. That keeps the runtime simple while preserving a single source of truth for locks, moves, permanent joins, progress and completion.
1.2s state refreshOptimistic concurrency15s cluster locks
State refresh
The client requests a fresh authoritative snapshot every 1.2 seconds.
Presence
An 8-second heartbeat updates each participant; the UI treats activity within 22 seconds as online.
Drag ownership
A cluster receives a 15-second server-side lock so two people cannot drag it simultaneously.
Write conflicts
Every puzzle row has a version. Updates use compare-and-swap and retry up to four times if another player wins the race.
Snapping
The server validates neighbor geometry, permanently joins correct clusters, and fixes correctly placed groups below loose pieces.
Completion
The last join makes the table read-only, records completion statistics and schedules deletion 12 hours later.
Persistence
Relational records, not data files
The durable game record lives in Cloudflare D1, a relational SQLite-compatible database. A single versioned puzzle row carries the structured session state needed to reconstruct every board. User image bytes live separately in R2 object storage.
Record areaWhat is stored
Puzzle identityID, name, status, visibility, join code and invitation token
RulesPreview policy, piece style and target piece count
Image recordLibrary/upload type, storage reference and attribution metadata
Live statePieces, clusters, board coordinates, participants, chat, locks and completion statistics in versioned JSON
LifecycleCreated, updated, activity, completion and expiry timestamps
D1 relational database
The logical application binding is DB. Physical database IDs and provider credentials are intentionally not exposed.
R2 object storage
The logical binding is FILES. Uploaded originals are deleted with the puzzle. Curated library images remain at their licensed sources with attribution metadata.
Managed platform
Hosting and deployment
OpenAI Sites manages the site object, access rules, saved versions and deployments. The application is compiled to a Cloudflare Worker-compatible ESM bundle with static assets, then published as one validated version.
plugin 0.2.0
OpenAI Sites
Owns the site, saved versions, access policy and deployment lifecycle.
managed runtime · types 4.20260515.1
Cloudflare Workers
Runs the built application and API close to users in a serverless worker environment.
managed service · SQLite-compatible
Cloudflare D1
Relational, durable storage for puzzle records and authoritative session state.
managed service
Cloudflare R2
Object storage for user-uploaded source images during each puzzle’s lifetime.
4.92.0
Wrangler
Local Cloudflare runtime tooling used by the packaged server build.
>=22.13.0 · development 22.19.0
Node.js
Local JavaScript toolchain. The hosted request runtime is Cloudflare Workers, not a long-running Node server.
What a release contains
The exact committed source is built into a worker entry point plus browser assets. A source archive from the same commit is attached to the saved Sites version. Only after that version validates successfully is it promoted to the site URL over HTTPS.
Exact commitMatching source archiveValidated saved version
Source control
Where the repository lives and how it is managed
The working copy is in a local Codex project workspace on the development machine. Its deployment remote is a private Git repository managed by OpenAI Sites, on the main branch.
Commit-to-deploy workflow
One auditable source state per release
- 1Changes are made and checked in the local Git working copy.
- 2The exact commit is pushed to the private Sites-managed source repository.
- 3That same commit is built and packaged with its source archive.
- 4Sites saves, validates and deploys the resulting version.
GitHub status
Not currently the deployment repository
The project can be mirrored to a user-owned GitHub repository for collaboration or backup. In the current setup, however, OpenAI Sites deploys from its own managed Git source, so a GitHub copy would be an additional remote rather than the live deployment origin.
Exact repository URLs, host identifiers and authentication details are intentionally omitted.
Data protection
Useful detail, without secrets
The app exposes architectural facts that help someone understand or maintain it, while keeping operational identifiers and user credentials out of the page and browser bundle.
Identity and control
Participant tokens and creator keys are represented by SHA-256 hashes in durable state. Creator-only operations are rechecked by the server.
Automatic deletion
Completed puzzles expire after 12 hours. Active puzzles with no activity for seven days are removed. Uploaded originals are deleted with their puzzle.
Not published here
No access tokens, credentials, database IDs, bucket names, participant secrets, active join codes, project IDs or private repository addresses appear on this page.
Two kinds of privacy: OpenAI Sites controls who can open the website; PieceTogether separately controls whether an individual puzzle is public or requires its link or code. The current Sites access policy is owner-only.
Complete manifest
Every direct package and pinned version
This is the full direct dependency inventory from package.json. Some support packages provide reusable controls or build tooling and are not invoked by every screen.
Application dependencies
@base-ui/react1.7.0@shadcn/react0.3.0class-variance-authority0.7.1clsx2.1.1cmdk1.1.1date-fns4.1.0drizzle-orm0.45.2embla-carousel-react8.5.2input-otp1.4.2lucide-react1.31.0react19.2.6react-day-picker9.8.1react-dom19.2.6react-resizable-panels4.5.8react-server-dom-webpack19.2.6recharts3.8.0shadcn4.18.0simple-icons16.29.0tailwind-merge3.6.0tw-animate-css1.4.0vinext1.0.0-beta.5Development and build dependencies
@cloudflare/vite-plugin1.37.1@cloudflare/workers-types4.20260515.1@openai/sites-vite-plugin0.2.0@tailwindcss/postcss4.2.1@types/node22.19.19@types/react19.2.14@types/react-dom19.2.3@vitejs/plugin-react6.0.2@vitejs/plugin-rsc0.5.26drizzle-kit0.31.10oxfmt0.61.0oxlint1.76.0oxlint-tsgolint7.0.2001tailwindcss4.2.1typescript5.9.3vite8.0.13wrangler4.92.0Node.js on this build machine
22.19.0
npm on this build machine
11.8.0
Git on this build machine
2.53.0.windows.1
Version inventory recorded from the application manifest and release environment on August 30, 2026. Managed Cloudflare service versions are intentionally described as managed rather than assigned an invented package number.
That is the machinery