\n {m.label} · {store.toUpperCase()}\n \n \n \n {Math.round(ms)}ms\n

\n );\n}\n\nfunction CellBars({ s, size, op, scale }: { s: Snapshot; size: string; op: Op; scale: number }) {\n const r2 = cell(s, \"r2\", size, op);\n const s3 = cell(s, \"s3\", size, op);\n if (!r2 || !s3) return null;\n const x = (r2.p50 / s3.p50).toFixed(1);\n return (\n

{op} · {size}

\n {x}× faster\n

\n \n \n

\n );\n}\n\nfunction Chart({ s }: { s: Snapshot }) {\n const scale = Math.max(...s.rows.map((r) => r.stat.p50));\n return (\n

Median latency, measured in-region

{s.iterations} samples per bar · lower is better

\n {OPS.flatMap((op) => s.sizes.map((size) => ))}\n

\n );\n}\n\nfunction TailTable({ s }: { s: Snapshot }) {\n const cols: { k: keyof Stat; label: string }[] = [\n { k: \"p50\", label: \"p50\" },\n { k: \"p90\", label: \"p90\" },\n { k: \"p99\", label: \"p99\" },\n { k: \"max\", label: \"max\" },\n ];\n return (\n

Full distribution

where R2's slow tail really shows — all ms

\n \n \n \n \n \n {cols.map((c) => )}\n \n \n \n {OPS.flatMap((op) =>\n s.sizes.flatMap((size) =>\n ([\"r2\", \"s3\"] as Store[]).map((store) => {\n const st = cell(s, store, size, op);\n const m = STORE_META[store];\n return (\n \n \n \n {cols.map((c) => (\n \n ))}\n \n );\n })\n )\n )}\n \n

backend	op · size	{c.label}
{m.label} {store.toUpperCase()}	{op} · {size}	{st ? st[c.k] : \"—\"}

\n );\n}\n\nfunction Race({ initial }: { initial: { store: Store; ms: number } }) {\n // The visceral demo: this very report is stored in both backends. Load it from\n // either and feel the difference. Client wiring lives in client.ts.\n return (\n

This report is served from blob storage

Same bytes in both stores. Load it from either and watch the clock.

\n \n \n \n Loaded from {initial.store.toUpperCase()} in {Math.round(initial.ms)}ms on page load\n \n

\n );\n}\n\nfunction Controls({ runs, currentId, iterations }: { runs: string[]; currentId: string; iterations: number }) {\n return (\n

\n \n {runs.length > 1 && (\n

Past runs

\n \n {id.replace(\"T\", \" \").slice(0, 19)}\n \n

\n )}\n

\n );\n}\n\nexport function renderPage(props: {\n snapshot: Snapshot;\n runs: string[];\n currentId: string;\n initialRead: { store: Store; ms: number };\n iterations: number;\n}): string {\n const { snapshot, runs, currentId, initialRead, iterations } = props;\n const h = headline(snapshot);\n const doc = (\n \n \n \n \n Val Town Blob: R2 → S3\n \n \n \n \n

Val Town · Blob Storage

Blob got ~{h.speedup.toFixed(0)}× faster

\n We moved blob storage from Cloudflare R2 to S3. Reads and writes dropped from\n ~250ms to ~50ms, and the p99 tail fell from ~{h.r2p99}ms to ~{h.s3p99}ms — measured\n from inside a val, the new store against the old.\n

\n \n \n \n \n \n

\n Running benchmark (~30s)…\n

\n \n \n \n );\n return \"\" + doc.toString();\n}\n","label",[137],"66e17908-a217-4707-a801-9f9b2c098a3a","types.ts","693d2a58-6128-11f1-bf40-1607ee4eb77e",3,["D",1780696161729],"import type { Store } from \"./blob.ts\";\n\nexport type Op = \"set\" | \"get\";\n\n/** Summary of one latency distribution, all in milliseconds. */\nexport interface Stat {\n n: number;\n min: number;\n p50: number;\n p90: number;\n p99: number;\n max: number;\n mean: number;\n}\n\n/** One measured cell: a backend doing one op at one payload size. */\nexport interface Row {\n store: Store;\n size: string; // e.g. \"1KB\", \"100KB\", \"1MB\"\n op: Op;\n stat: Stat;\n}\n\n/** A single benchmark run, the unit we persist to blob storage. */\nexport interface Snapshot {\n id: string; // sortable, blob-key-safe, e.g. \"2026-06-05T21-49-03-123Z\"\n createdAt: string; // ISO timestamp\n iterations: number; // measured samples per cell\n sizes: string[];\n rows: Row[];\n}\n",[147],"a6cebc41-8092-4d33-b218-5ec5abad8a6c","store.ts","7e62efb2-6128-11f1-a244-1607ee4eb77e",7,["D",1780696208889],1,"import { type Store, stores } from \"./blob.ts\";\nimport type { Snapshot } from \"./types.ts\";\n\nconst RUNS = \"blob-bench/runs/\"; // one object per run\nconst LATEST = \"blob-bench/latest.json\"; // the most recent run, for instant load\n\n/**\n * Persist a snapshot to BOTH backends under identical keys. That's what makes the\n * \"load this report from R2 vs S3\" demo a fair fight: same bytes, same key, the\n * only difference is which store answers.\n */\nexport async function saveSnapshot(snap: Snapshot): Promise {\n const json = JSON.stringify(snap);\n await Promise.all(\n (Object.keys(stores) as Store[]).flatMap((s) => [\n stores[s].set(`${RUNS}${snap.id}.json`, json),\n stores[s].set(LATEST, json),\n ]),\n );\n}\n\n/** Read the latest snapshot from one backend, returning the data and the read latency. */\nexport async function loadLatest(\n store: Store,\n): Promise<{ snapshot: Snapshot | null; ms: number }> {\n const t0 = performance.now();\n const snapshot = await stores[store].getJSON(LATEST).catch(() => null);\n return { snapshot: snapshot ?? null, ms: performance.now() - t0 };\n}\n\n/** Read one run by id from one backend. */\nexport async function loadRun(store: Store, id: string): Promise {\n return (await stores[store].getJSON(`${RUNS}${id}.json`).catch(() => null)) ?? null;\n}\n\n/** List past run ids (newest first), reading the index from S3. */\nexport async function listRuns(): Promise {\n const items = await stores.s3.list(RUNS).catch(() => []);\n return items\n .map((b) => b.key.slice(RUNS.length).replace(/\\.json$/, \"\"))\n .filter(Boolean)\n .sort()\n .reverse();\n}\n",[154],"afd6cf8b-4771-47f4-be5b-6c5f770daac4","stats.ts","6e196870-6128-11f1-9ef0-1607ee4eb77e",4,["D",1780696169873],"import type { Stat } from \"./types.ts\";\n\n/** Linear-interpolated percentile (numpy default) over an already-sorted array. */\nfunction percentile(sorted: number[], p: number): number {\n const idx = (sorted.length - 1) * p;\n const lo = Math.floor(idx);\n const hi = Math.ceil(idx);\n return sorted[lo] + (sorted[hi] - sorted[lo]) * (idx - lo);\n}\n\nconst round = (n: number) => Math.round(n * 10) / 10;\n\n/** Reduce a list of latency samples (ms) to a Stat. */\nexport function summarize(samples: number[]): Stat {\n if (samples.length === 0) {\n return { n: 0, min: NaN, p50: NaN, p90: NaN, p99: NaN, max: NaN, mean: NaN };\n }\n const s = [...samples].sort((a, b) => a - b);\n return {\n n: s.length,\n min: round(s[0]),\n p50: round(percentile(s, 0.5)),\n p90: round(percentile(s, 0.9)),\n p99: round(percentile(s, 0.99)),\n max: round(s[s.length - 1]),\n mean: round(s.reduce((a, b) => a + b, 0) / s.length),\n };\n}\n",[162],"0d474b6e-7103-41d8-8292-343bff755892","index.ts",11,["D",1780696360561],"import { Hono } from \"npm:hono\";\nimport { parseVal } from \"https://esm.town/v/std/utils/index.ts\";\nimport type { Store } from \"./blob.ts\";\nimport { runBenchmark } from \"./bench.ts\";\nimport { listRuns, loadLatest, loadRun, saveSnapshot } from \"./store.ts\";\nimport { renderPage } from \"./view.tsx\";\n\nconst app = new Hono();\napp.onError((err) => Promise.reject(err)); // full stack traces in logs\n\nconst asStore = (v: string | undefined): Store => (v === \"r2\" ? \"r2\" : \"s3\");\n\n// Homepage: SSR the latest run (or ?run=) from S3 — the instant path.\napp.get(\"/\", async (c) => {\n const runId = c.req.query(\"run\");\n const latest = await loadLatest(\"s3\");\n const snapshot = runId ? (await loadRun(\"s3\", runId)) ?? latest.snapshot : latest.snapshot;\n\n if (!snapshot) {\n return c.html(\n `\n

No benchmark yet

\n `,\n );\n }\n\n const runs = await listRuns();\n return c.html(renderPage({\n snapshot,\n runs,\n currentId: snapshot.id,\n initialRead: { store: \"s3\", ms: latest.ms },\n iterations: snapshot.iterations,\n }));\n});\n\n// The \"race\" endpoint: read the latest snapshot from the chosen backend, report\n// the server-side blob read latency and payload size.\napp.get(\"/data\", async (c) => {\n const store = asStore(c.req.query(\"store\"));\n const { snapshot, ms } = await loadLatest(store);\n return c.json({\n store,\n ms,\n bytes: snapshot ? JSON.stringify(snapshot).length : 0,\n id: snapshot?.id ?? null,\n });\n});\n\n// Re-run: benchmark fresh, persist to both stores, then show the new run.\napp.post(\"/runs\", async (c) => {\n const body = await c.req.parseBody();\n const requested = Number(body.iterations ?? 12);\n const iterations = Math.min(20, Math.max(4, Number.isFinite(requested) ? requested : 12));\n const snapshot = await runBenchmark(iterations);\n await saveSnapshot(snapshot);\n return c.redirect(`/?run=${snapshot.id}`);\n});\n\napp.get(\"/source\", (c) => c.redirect(parseVal().links.self.val));\n\nexport default app.fetch;\n",[169],"0e286a77-89a9-4351-a374-870e1e200a7b","client.ts","cf806dca-6128-11f1-a08c-1607ee4eb77e",10,["D",1780696333299],"// Minimal browser wiring. Two jobs: the R2-vs-S3 \"race\" readout, and a progress\n// overlay while a re-run is in flight. No framework, no hydration.\n\nconst out = document.getElementById(\"race-out\");\n\nasync function race(store: \"r2\" | \"s3\", btn: HTMLButtonElement) {\n if (!out) return;\n btn.disabled = true;\n out.textContent = `Loading from ${store.toUpperCase()}…`;\n const t0 = performance.now();\n const res = await fetch(`/data?store=${store}`);\n const data = await res.json();\n const roundTrip = Math.round(performance.now() - t0);\n out.textContent =\n `Loaded from ${store.toUpperCase()} in ${roundTrip}ms ` +\n `(blob read ${Math.round(data.ms)}ms · ${(data.bytes / 1024).toFixed(1)}KB)`;\n out.setAttribute(\"data-store\", store);\n btn.disabled = false;\n}\n\ndocument.getElementById(\"race-r2\")?.addEventListener(\n \"click\",\n (e) => race(\"r2\", e.currentTarget as HTMLButtonElement),\n);\ndocument.getElementById(\"race-s3\")?.addEventListener(\n \"click\",\n (e) => race(\"s3\", e.currentTarget as HTMLButtonElement),\n);\n\ndocument.getElementById(\"rerun\")?.addEventListener(\"submit\", () => {\n const overlay = document.getElementById(\"rerun-overlay\");\n if (overlay) {\n overlay.classList.remove(\"hidden\");\n overlay.classList.add(\"flex\");\n }\n});\n",[175],"8b55f015-c9a0-4519-be52-1c387f7d6aae","blob.ts","6437edb8-6128-11f1-9ef0-1607ee4eb77e",2,["D",1780696153308],"// The two storage backends, side by side. This is the ONLY place we import\n// the std blob clients — everything else talks to `stores`.\n//\n// s3 → std/blob/main.ts → /v2/blob → scoped, S3-backed (new)\n// r2 → std/blob/global.ts → /v1/blob → global, R2-backed (old)\nimport { blob as s3 } from \"https://esm.town/v/std/blob/main.ts\";\nimport { blob as r2 } from \"https://esm.town/v/std/blob/global.ts\";\n\nexport const stores = { s3, r2 } as const;\nexport type Store = keyof typeof stores; // \"s3\" | \"r2\"\n\nexport const STORE_META: Record = {\n s3: { label: \"new\", backend: \"S3 (scoped)\", tone: \"emerald\" },\n r2: { label: \"old\", backend: \"R2 (global)\", tone: \"rose\" },\n};\n",[182],"0f4ff39e-a472-45e6-a4ff-559806d0f1e6","bench.ts","77a58f9a-6128-11f1-9375-1607ee4eb77e",5,["D",1780696185902],"import { type Store, stores } from \"./blob.ts\";\nimport { summarize } from \"./stats.ts\";\nimport type { Op, Row, Snapshot } from \"./types.ts\";\n\nconst SIZES: { label: string; bytes: number }[] = [\n { label: \"1KB\", bytes: 1024 },\n { label: \"100KB\", bytes: 100 * 1024 },\n { label: \"1MB\", bytes: 1024 * 1024 },\n];\nconst STORE_ORDER: Store[] = [\"r2\", \"s3\"];\nconst PROBE_PREFIX = \"blob-bench/_probe/\";\n\nfunction payload(bytes: number): Uint8Array {\n const a = new Uint8Array(bytes);\n for (let i = 0; i < bytes; i++) a[i] = (i * 31 + 7) & 0xff;\n return a;\n}\n\nasync function timed(fn: () => Promise): Promise {\n const t0 = performance.now();\n await fn();\n return performance.now() - t0;\n}\n\n// One op against one backend. `get` drains the body so we time the full download.\nasync function once(store: Store, op: Op, key: string, body: Uint8Array): Promise {\n const blob = stores[store];\n if (op === \"set\") return timed(() => blob.set(key, body));\n return timed(async () => {\n const res = await blob.get(key);\n await res.arrayBuffer();\n });\n}\n\n/**\n * Run the full matrix: every (store, size, op), `iterations` measured samples each.\n * Backends are interleaved per iteration so any drift hits both symmetrically, and\n * each cell gets one discarded warm-up to remove cold-start bias.\n */\nexport async function runBenchmark(iterations = 12): Promise {\n const createdAt = new Date().toISOString();\n const id = createdAt.replace(/[:.]/g, \"-\");\n const samples = new Map(); // `${store}|${size}|${op}` -> ms[]\n const push = (store: Store, size: string, op: Op, ms: number) => {\n const k = `${store}|${size}|${op}`;\n (samples.get(k) ?? samples.set(k, []).get(k)!).push(ms);\n };\n\n for (const size of SIZES) {\n const data = payload(size.bytes);\n const key = (store: Store, i: number) => `${PROBE_PREFIX}${store}/${size.label}/${i}`;\n\n // warm-up (seeds a value so the first get has something to read), discarded\n for (const store of STORE_ORDER) {\n await once(store, \"set\", key(store, 0), data);\n await once(store, \"get\", key(store, 0), data);\n }\n\n for (let i = 0; i < iterations; i++) {\n for (const store of STORE_ORDER) {\n push(store, size.label, \"set\", await once(store, \"set\", key(store, i), data));\n push(store, size.label, \"get\", await once(store, \"get\", key(store, i), data));\n }\n }\n\n // tidy up the probe keys we wrote\n await Promise.allSettled(\n STORE_ORDER.flatMap((store) =>\n Array.from({ length: iterations }, (_, i) => stores[store].delete(key(store, i)))\n ),\n );\n }\n\n const rows: Row[] = [];\n for (const [k, ms] of samples) {\n const [store, size, op] = k.split(\"|\") as [Store, string, Op];\n rows.push({ store, size, op, stat: summarize(ms) });\n }\n\n return { id, createdAt, iterations, sizes: SIZES.map((s) => s.label), rows };\n}\n",[189],"47570edd-68df-4044-a893-9a1ededbd10f","_smoke.ts","8af8465a-6128-11f1-814a-1607ee4eb77e",8,["D",1780696218316],"import { runBenchmark } from \"./bench.ts\";\nimport { listRuns, loadLatest, saveSnapshot } from \"./store.ts\";\n\nconst snap = await runBenchmark(2);\nawait saveSnapshot(snap);\nconst s3 = await loadLatest(\"s3\");\nconst r2 = await loadLatest(\"r2\");\nconst runs = await listRuns();\nconsole.log(JSON.stringify({\n id: snap.id,\n rows: snap.rows.length,\n sampleRow: snap.rows[0],\n s3ReadMs: +s3.ms.toFixed(1),\n r2ReadMs: +r2.ms.toFixed(1),\n loadedOk: s3.snapshot?.id === snap.id && r2.snapshot?.id === snap.id,\n runCount: runs.length,\n}, null, 2));\n",[196],"pulls","branches","forks","envVars",{"_209":62,"_211":62},"connections",{"_209":62,"_210":62},"count","unfilledCount","emptyCount",{"_42":195,"_32":196,"_30":197,"_139":-5,"_40":41,"_39":198,"_141":48,"_37":246,"_13":62,"_33":34,"_35":200,"_24":48,"_144":-5,"_222":247,"_27":248},{"_42":188,"_32":189,"_30":190,"_139":-5,"_40":41,"_39":191,"_141":48,"_37":243,"_13":62,"_33":34,"_35":193,"_24":48,"_144":-5,"_222":244,"_27":245},{"_42":181,"_32":182,"_30":183,"_139":-5,"_40":41,"_39":184,"_141":25,"_37":240,"_13":62,"_33":34,"_35":186,"_24":48,"_144":-5,"_222":241,"_27":242},{"_42":174,"_32":175,"_30":176,"_139":-5,"_40":41,"_39":177,"_141":48,"_37":237,"_13":62,"_33":34,"_35":179,"_24":48,"_144":-5,"_222":238,"_27":239},{"_42":168,"_32":169,"_30":57,"_139":-5,"_40":41,"_39":170,"_141":48,"_37":234,"_13":62,"_33":34,"_35":172,"_24":48,"_144":-5,"_222":235,"_27":236},{"_42":161,"_32":162,"_30":163,"_139":-5,"_40":41,"_39":164,"_141":25,"_37":231,"_13":62,"_33":34,"_35":166,"_24":48,"_144":-5,"_222":232,"_27":233},{"_42":153,"_32":154,"_30":155,"_139":-5,"_40":41,"_39":156,"_141":48,"_37":228,"_13":158,"_33":34,"_35":159,"_24":48,"_144":-5,"_222":229,"_27":230},{"_42":146,"_32":147,"_30":148,"_139":-5,"_40":41,"_39":149,"_141":48,"_37":225,"_13":62,"_33":34,"_35":151,"_24":48,"_144":-5,"_222":226,"_27":227},{"_42":136,"_32":137,"_30":138,"_139":-5,"_40":41,"_39":140,"_141":48,"_37":221,"_13":62,"_33":34,"_35":143,"_24":48,"_144":-5,"_222":223,"_27":224},["D",1780696317400],"children",[],[137],["D",1780696161729],[],[147],["D",1780696208889],[],[154],["D",1780696169873],[],[162],["D",1780696360561],[],[169],["D",1780696333299],[],[175],["D",1780696153308],[],[182],["D",1780696185902],[],[189],["D",1780696218316],[],[196],["D",1780696144434],{"_96":95,"_104":100},{"_96":95,"_97":98,"_99":100,"_18":-5,"_101":102,"_103":25},{"_13":85,"_32":86,"_42":41,"_87":43,"_88":-5,"_89":-5,"_90":-5,"_91":-5,"_92":-5,"_93":44,"_94":95},"ctx",{"_78":-5,"_124":286,"_287":288,"_289":290,"_291":48,"_292":48,"_293":48,"_294":25,"_295":-5,"_296":-7,"_297":-7,"_298":62,"_299":48,"_300":48,"_301":-5,"_302":48,"_303":48,"_304":48,"_305":-5},"ENV",{"_257":258,"_259":260,"_261":86,"_262":263,"_264":265,"_266":267,"_268":269,"_270":271,"_272":273,"_274":275,"_276":277,"_278":279,"_280":281,"_282":283,"_284":285},"REACT_APP_SENTRY_DSN","https://586020d86f05489db63a554690acf1e9@o1398359.ingest.sentry.io/6724499","RENDER_GIT_COMMIT","e87eb04e707cf64e7e532c8e8ec395f209e17f15","RENDER_GIT_BRANCH","POSTHOG_API_TOKEN","phc_nmoyuAkStEZuUp69rYlg1DZgrIt19Gx0Y4Hwf8tGgJP","POSTHOG_API_HOST","https://wart.val.town","WEB_API_TEMPLATE","https://{val}.web.val.run","APP_URL","https://www.val.town","MODULE_URL","https://esm.town","VANITY_WEB_API_TEMPLATE","https://{label}.val.run/","DENOLS_URL","https://lsp.val.town","NODE_ENV","production","CLOUDFLARE_TURNSTILE_SITE_KEY","0x4AAAAAACtaIZJH7s9rBMZ6","GOOGLE_CLIENT_ID","875989696899-jtsqkhlbdv5jrlsk8631p7ipjg3c6o62.apps.googleusercontent.com","STRIPE_PUBLISHABLE_KEY","pk_live_51N2zvWEpZTTLipIkVEwXrUG9AT0yeOOEYxszarZT1jpsZV58Ly6wlg3SltZpHN26CUalOBmUSY7adQRQiSkCZz2500qSXNkf8Y","API_URL","https://api.val.town",[],"preferencesKeybindings","default","preferencesTheme","light","preferencesFixers","preferencesCopilot","preferencesSelectionAi","preferencesCloseBrackets","preferencesChatPanelState","preferencesDprint","preferencesDenofmt","notificationCount","flagDenols","isBusinessOrgMember","businessOrgHandle","isBusinessOrgAdmin","isHigherTownieTier","navCollapsed","currentOrgId"]

Diff · v12