Template-driven website demo engine
A single Cloudflare Worker that renders a complete, industry-specific website from a handful of URL parameters — every demo in this library comes from it.
Technical objective
Produce a convincing, mobile-ready website concept for any small business type in under a second, without a build step per site, so a design idea can be shown as a working page rather than a static mockup.
Constraints
- Zero per-demo infrastructure: one deployment must serve every industry.
- Fast on mid-range phones over 4G, because that is how most people open a shared link.
- No external content stored per business — everything is derived from a few parameters.
- Running cost close to zero on a free hosting tier.
Architecture
- 01
URL parameters
Template key, business name, city and optional details.
- 02
Template router
Keyword rules pick one of 17 industry templates when no key is given.
- 03
Site builder
Template functions assemble HTML, CSS and small interaction scripts.
- 04
Enhancement layers
Shared layers add the showcase reel, sticky mobile actions and clean naming.
- 05
Edge proxies
Image and licensed-video proxies with allow-lists, size caps and caching.
- 06
Sandboxed render
The page is written into a srcdoc iframe and served with noindex.
Flow runs left to right, top to bottom.
Key implementation decisions
Templates as functions, not files
Each industry is a function that returns markup from a data object. Adding an industry means adding data and a function — no new routes, no new deployment targets.
Parameters over a database
A demo is fully described by its URL, so links are reproducible, cacheable and never depend on stored personal data.
Keyword routing before AI
Business names are matched against ordered keyword rules. It is deterministic, explainable and free; an AI step can be layered on later for the ambiguous cases.
Allow-listed edge proxies
The image proxy only accepts image content types under 8 MB and blocks private addresses; the video proxy only serves an explicit list of licensed clip IDs.
Screenshots
Challenges
Shared category codes
Official business category codes are shared across very different trades (a nail bar and a hair salon can share one). Name keywords turned out to be a far better signal, with the code used only as a fallback.
Procedural 3D did not read as premium
An early version built 3D rooms in code. It was technically interesting but looked artificial. Real licensed footage with scroll-driven motion replaced it — a reminder that fidelity beats cleverness.
Lessons learned
- A demo that runs in the browser is more persuasive than any static mockup.
- Deterministic rules plus clear fallbacks beat an opaque model for routing decisions.
- Every proxy endpoint needs an allow-list from day one.