`, favicon, and body of `Root()` to\nmatch your app's existing `index.html`, and stamp anything else your shell\nreferences directly (images, css) with `immutableFileUrl()`.\n\n1. Create `frontend/root.tsx`:\n\n```tsx\n/** @jsxImportSource npm:hono@4/jsx */\nimport { raw } from \"npm:hono@4/html\";\nimport { immutableFileUrl } from \"https://esm.town/v/std/utils/index.ts\";\n\n// The HTML shell for the app. It is never cached, so immutableFileUrl can stamp\n// the current val version into each asset URL — the browser caches those\n// immutably, and publishing the val changes the URLs, refetching exactly once.\nexport function Root() {\n return (\n <>\n {raw(\"<!DOCTYPE html>\")}\n <html lang=\"en\">\n <head>\n <meta charSet=\"UTF-8\" />\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\" />\n <title>React Hono Val Town Starter

[{"_1":2,"_3":-5,"_4":-5},"loaderData",{"_5":6,"_7":8,"_9":10},"actionData","errors","root",{"_404":405,"_406":407},"routes/_app.x.$handle.$name",{"_102":101,"_32":45,"_111":90,"_27":112,"_13":14,"_113":-5,"_11":114,"_115":116,"_117":118,"_119":120,"_121":122,"_20":-5,"_123":-5,"_124":125,"_126":25,"_127":128,"_129":59,"_130":-5,"_131":-5,"_132":133},"routes/_app.x.$handle.$name.branch.$branch.version.$version.diff",{"_11":12,"_13":14,"_15":16,"_17":-5,"_18":-5},"project",{"_43":44,"_32":45,"_38":46,"_47":-5,"_48":25,"_49":50,"_51":50,"_52":53,"_54":-5,"_18":55,"_56":57,"_58":59,"_60":-5,"_61":-5,"_62":63,"_64":65,"_66":67,"_68":69,"_70":71,"_72":-5,"_73":74,"_75":74,"_76":77,"_78":77,"_79":77,"_80":74,"_81":74,"_82":83,"_84":85,"_86":87,"_88":25},"version",34,"changes",[19],"aiChatInfo","userId",{"_20":21,"_22":23,"_24":25,"_26":25,"_27":28,"_29":28},"file",{"_30":31,"_32":33,"_34":35,"_36":37,"_38":39,"_40":14,"_41":42,"_24":25},"previous",{"_30":31,"_32":33,"_34":35,"_36":37},"deleted",false,"deletedHere","path","tests/selftest.ts","latestPath","fileId","2476d014-aafb-11f1-a319-1607ee4eb77e","name","selftest.ts","fileType","script","content","import handler from \"./index.ts\";\nimport { analyzeMarket, normalizeSymbol, supportedSymbols } from \"./lib/market.ts\";\n\nconst results: any[] = [];\nfunction check(name: string, pass: boolean, details?: unknown) {\n results.push({ name, pass, details });\n if (!pass) throw new Error(`SELFTEST_FAIL:${name}`);\n}\n\nfor (const bad of [\"INVALIDXYZ\", \"BTCUSDT&foo=bar\", \"../BTCUSDT\", \"\"]) {\n let rejected = false;\n try { normalizeSymbol(bad); } catch { rejected = true; }\n if (bad === \"\") {\n // empty input normalizes to default only when nullish is not used; explicit empty must not leave allowlist.\n check(\"explicit_empty_rejected\", rejected);\n } else check(`invalid_symbol_rejected:${bad}`, rejected);\n}\n\nfor (const symbol of supportedSymbols()) {\n const r: any = await analyzeMarket(symbol);\n check(`${symbol}:evidence`, [\"PASS\", \"PARTIAL\"].includes(r.evidenceState), r.evidenceState);\n check(`${symbol}:read_only`, r.readOnly === true && r.boundary === \"MARKET_DATA_READ != TRADING_AUTH\");\n check(`${symbol}:price_positive`, Number(r.market?.lastPrice) > 0, r.market?.lastPrice);\n check(`${symbol}:spread_nonnegative`, Number(r.microstructure?.spreadBps) >= 0, r.microstructure?.spreadBps);\n check(`${symbol}:imbalance_bounded`, Math.abs(Number(r.microstructure?.orderBookImbalance)) <= 1.000001, r.microstructure?.orderBookImbalance);\n check(`${symbol}:stability_bounded`, Number(r.assessment?.stabilityScore) >= 0 && Number(r.assessment?.stabilityScore) <= 1, r.assessment?.stabilityScore);\n check(`${symbol}:stability_not_probability`, String(r.assessment?.stabilityMeaning ?? \"\").includes(\"not a calibrated probability\"));\n check(`${symbol}:no_trade_recommendation`, r.assessment?.recommendation === \"NO_TRADE_DECISION\");\n check(`${symbol}:receipts_present`, Array.isArray(r.receipts) && r.receipts.length === 3, r.receipts?.length);\n check(`${symbol}:series_present`, Array.isArray(r.shortHorizon?.closeSeries) && r.shortHorizon.closeSeries.length >= 12, r.shortHorizon?.closeSeries?.length);\n const closeTime = Number(r.market?.tickerCloseTime);\n check(`${symbol}:ticker_currentness`, Number.isFinite(closeTime) && Math.abs(Date.now() - closeTime) < 5 * 60_000, { closeTime, ageMs: Date.now() - closeTime });\n}\n\nconst post = await handler(new Request(\"https://local.test/api/analyze?symbol=BTCUSDT\", { method: \"POST\" }));\ncheck(\"post_not_supported\", post.status === 404, post.status);\nconst unknown = await handler(new Request(\"https://local.test/api/does-not-exist\"));\ncheck(\"unknown_route_404\", unknown.status === 404, unknown.status);\n\nconst pass = results.every(r => r.pass);\nconsole.log(JSON.stringify({ pass, version: \"1.0.0\", tests: results.length, results }));\nexport default { pass, tests: results.length };\n","createdAt",["D",1788813780769],"branchVersion","branchId","7cb33925-37d8-48ee-9d8b-5712686d33fd","id","71ad8a44-f36c-41e9-a978-0707deb4f71b","payana-binance-agent-os",["D",1788812694161],"deletedAt","legacyEnvVars","privacy","public","httpPrivacy","description","PayAna Falsifier Agent — evidence-first Binance market audit","imageUrl","6cc24525-830b-4db3-9c9c-fd19fb50e91f","pinnedFileId","01a07d8b-9306-748f-a55c-5a7124e2c8be","pinPreview",true,"pinMigrated","screenshotVersion","likeCount",0,"orgId","01a0773d-9d6b-7580-a53a-683363c351c8","tursoName","71ad8a44f36c41e9a9780707deb4f71b","tursoHostname","71ad8a44f36c41e9a9780707deb4f71b-val-town.aws-us-east-2.turso.io","tursoMeasuredAt",["D",1789509043237],"pinned","userPerm","r","valPerm","blobPerm","rw","emailPerm","sqlitePerm","projectPerm","telemetryPerm","user",{"_102":101,"_110":106},"org",{"_102":101,"_103":104,"_105":106,"_18":55,"_107":108,"_109":25},"branch",{"_13":89,"_32":90,"_43":42,"_91":44,"_92":93,"_94":95,"_96":50,"_97":44,"_98":65,"_99":45,"_100":101},"isOwned",55,"market-sentinel-v1","projectId","forkedBranchId","182c3c5a-4b2f-4ec3-8cf6-a4632f8ec886","forkedBranchVersion",3,"forkedProjectPrivacy","forkedProjectId","forkedProjectOrgId","projectName","userHandle","cleitoncosta","handle","displayName","Cleiton Costa","avatar","https://lh3.googleusercontent.com/a/ACg8ocIgWisWQiXts_2fy5iRiRgl8A6c7Ef94eqE3ur-4mlyUrpCBmQ=s96-c","tier","free","canRestrictVals","profileImageUrl","branchName","","adoptOrgId",{"_43":44,"_32":45,"_38":399,"_47":-5,"_48":25,"_49":50,"_51":50,"_52":53,"_54":-5,"_18":55,"_56":57,"_58":59,"_60":-5,"_61":-5,"_62":63,"_64":65,"_66":67,"_68":69,"_70":400,"_72":-5,"_73":74,"_75":74,"_76":77,"_78":77,"_79":77,"_80":74,"_81":74,"_82":401,"_84":402,"_86":403,"_88":25},"tree",[232,237,240,248,250,252,253,254,255,256],"files",[232,233,234,235,236,237,238,239,240,241,242,243,244,245,246,247,248,249,250,251,252,253,254,255,256],"counts",{"_220":63,"_221":222,"_223":224,"_225":226,"_227":228},"contents",[141,142,143,144,145,146,147,148,149,150],"upstreamProject","upstreamBranch",{"_43":93,"_38":134,"_135":136,"_32":137,"_91":44,"_13":138,"_92":-5,"_94":-5,"_139":140,"_47":-5,"_88":25,"_49":50,"_100":101,"_64":65,"_99":45},"emptyEnvVars","flags",[],"hasHttpFiles","grants","orgs","customDomains",{},["D",1788812694161],"updatedAt",["D",1788827566539],"main",52,"lockfileKey","1788827566927-esm.town_v_cleitoncosta_payana-binance-agent-os@52-main",{"_43":214,"_32":215,"_30":216,"_154":-5,"_41":42,"_40":217,"_156":59,"_38":218,"_13":63,"_34":195,"_36":-5,"_24":25,"_159":-5,"_27":219},{"_43":208,"_32":209,"_30":210,"_154":-5,"_41":42,"_40":211,"_156":59,"_38":212,"_13":63,"_34":195,"_36":-5,"_24":25,"_159":-5,"_27":213},{"_43":203,"_32":204,"_30":205,"_154":-5,"_41":42,"_40":180,"_156":59,"_38":206,"_13":63,"_34":195,"_36":-5,"_24":25,"_159":-5,"_27":207},{"_43":197,"_32":198,"_30":199,"_154":-5,"_41":42,"_40":200,"_156":59,"_38":201,"_13":63,"_34":195,"_36":-5,"_24":25,"_159":-5,"_27":202},{"_43":190,"_32":191,"_30":192,"_154":-5,"_41":42,"_40":193,"_156":59,"_38":194,"_13":63,"_34":195,"_36":-5,"_24":25,"_159":-5,"_27":196},{"_43":184,"_32":185,"_30":186,"_154":-5,"_41":42,"_40":180,"_156":25,"_38":187,"_13":63,"_34":20,"_36":188,"_24":25,"_159":-5,"_27":189},{"_43":177,"_32":178,"_30":179,"_154":-5,"_41":42,"_40":180,"_156":25,"_38":181,"_13":63,"_34":20,"_36":182,"_24":25,"_159":-5,"_27":183},{"_43":170,"_32":171,"_30":172,"_154":-5,"_41":42,"_40":173,"_156":59,"_38":174,"_13":63,"_34":20,"_36":175,"_24":25,"_159":-5,"_27":176},{"_43":161,"_32":162,"_30":163,"_154":-5,"_41":42,"_40":164,"_156":25,"_38":165,"_13":166,"_34":167,"_36":168,"_24":25,"_159":-5,"_27":169},{"_43":151,"_32":152,"_30":153,"_154":-5,"_41":42,"_40":155,"_156":25,"_38":157,"_13":63,"_34":35,"_36":158,"_24":25,"_159":-5,"_27":160},"6c281280-1d63-4132-aaff-e4ee44789755","rate_limit_selftest.ts","4f12cf30-aafb-11f1-9bc1-1607ee4eb77e","parentId",17,"latest",["D",1788813176513],"import handler from \"./index.ts\";\n\nconst statuses:number[]=[];\nfor(let i=0;i<35;i++){\n const r=await handler(new Request(\"https://local.test/api/health\",{headers:{\"x-forwarded-for\":\"203.0.113.77\"}}));\n statuses.push(r.status);\n}\nconst first30=statuses.slice(0,30);\nconst tail=statuses.slice(30);\nconst pass=first30.every(s=>s===200)&&tail.every(s=>s===429);\nconsole.log(JSON.stringify({pass,statuses,rule:\"30 requests per 60s per runtime bucket\"}));\nif(!pass) throw new Error(\"RATE_LIMIT_SELFTEST_FAIL\");\nexport default {pass};\n","label",[152],"3b049091-26a5-47f6-8d7d-b532d522f320","index.ts","01a07d8d-933a-7578-bf59-4039f1d9d820",18,["D",1788813207897],2,"http","import { parseVal, serveImmutableFile } from \"https://esm.town/v/std/utils/index.ts\";\nimport { Hono } from \"npm:hono\";\nimport { Root } from \"./frontend/root.tsx\";\nimport { analyzeMarket, normalizeSymbol, supportedSymbols } from \"./lib/market.ts\";\n\nconst app = new Hono();\nconst buckets = new Map();\nconst RATE_WINDOW_MS = 60_000;\nconst RATE_MAX = 30;\n\nfunction clientKey(c: any) {\n return String(c.req.header(\"cf-connecting-ip\") || c.req.header(\"x-forwarded-for\") || \"unknown\").split(\",\")[0].trim().slice(0, 80);\n}\nfunction rateAllowed(key: string) {\n const now = Date.now();\n const bucket = buckets.get(key);\n if (!bucket || now - bucket.startedAt >= RATE_WINDOW_MS) {\n buckets.set(key, { startedAt: now, count: 1 });\n return true;\n }\n if (bucket.count >= RATE_MAX) return false;\n bucket.count += 1;\n if (buckets.size > 1000) {\n for (const [k, v] of buckets) if (now - v.startedAt >= RATE_WINDOW_MS) buckets.delete(k);\n }\n return true;\n}\n\napp.use(\"*\", async (c, next) => {\n c.header(\"X-Content-Type-Options\", \"nosniff\");\n c.header(\"Referrer-Policy\", \"no-referrer\");\n c.header(\"X-Frame-Options\", \"DENY\");\n c.header(\"Permissions-Policy\", \"camera=(), microphone=(), geolocation=(), payment=()\");\n c.header(\"Content-Security-Policy\", \"default-src 'self'; script-src 'self' https://esm.town https://esm.sh; style-src 'self'; connect-src 'self' https://esm.sh; img-src 'self' data:; font-src 'self'; object-src 'none'; base-uri 'none'; frame-ancestors 'none'\");\n await next();\n});\n\n\napp.use(\"/api/*\", async (c, next) => {\n c.header(\"Cache-Control\", \"no-store\");\n c.header(\"X-Content-Type-Options\", \"nosniff\");\n c.header(\"Referrer-Policy\", \"no-referrer\");\n if (!rateAllowed(clientKey(c))) return c.json({ status: \"BLOCKED\", error: \"RATE_LIMITED\", retryAfterSeconds: 60 }, 429);\n await next();\n});\n\napp.get(\"/\", (c) => c.html(Root()));\napp.get(\"/__immutable/*\", (c) => serveImmutableFile(c.req.path));\napp.get(\"/source\", (c) => c.redirect(parseVal().links.self.val));\n\napp.get(\"/api/health\", (c) => c.json({\n status: \"PASS\",\n service: \"PayAna Market Sentinel\",\n version: \"1.0.0\",\n mode: \"READ_ONLY_MARKET_EVIDENCE\",\n boundary: \"MARKET_DATA_READ != TRADING_AUTH\",\n supportedSymbols: supportedSymbols(),\n agentOsMcp: {\n endpointKnown: true,\n runtimeProbeState: \"OAUTH_AUTHORIZATION_REQUIRED\",\n liveAuthorizedSession: false,\n },\n marketData: {\n provider: \"Binance public market-data surface\",\n runtimeChampion: \"data-api.binance.vision\",\n directApiBinanceComFromValTown: \"HTTP_451_RESTRICTED_LOCATION\",\n },\n generatedAt: new Date().toISOString(),\n}));\n\napp.get(\"/api/symbols\", (c) => c.json({ status: \"PASS\", symbols: supportedSymbols() }));\n\napp.get(\"/api/analyze\", async (c) => {\n try {\n const symbol = normalizeSymbol(c.req.query(\"symbol\") ?? \"BTCUSDT\");\n const result = await analyzeMarket(symbol);\n const httpStatus = result.evidenceState === \"FAIL\" ? 503 : 200;\n return c.json(result, httpStatus);\n } catch (error) {\n const message = error instanceof Error ? error.message : String(error);\n const status = message === \"INVALID_SYMBOL_FORMAT\" || message === \"SYMBOL_NOT_ALLOWLISTED\" ? 400 : 500;\n return c.json({ status: \"FAIL\", error: message.slice(0, 180), boundary: \"NO_UNVALIDATED_SYMBOL_FORWARDING\" }, status);\n }\n});\n\napp.notFound((c) => c.json({ status: \"FAIL\", error: \"NOT_FOUND\" }, 404));\napp.onError((err) => {\n console.error(\"UNHANDLED\", err instanceof Error ? err.message : String(err));\n return new Response(JSON.stringify({ status: \"FAIL\", error: \"INTERNAL_ERROR\" }), { status: 500, headers: { \"content-type\": \"application/json\" } });\n});\n\nexport default app.fetch;\n",[162],"0a479271-a8c6-4388-a93e-b78118c728c1","SKILL.md","7f52caf0-aafc-11f1-908d-1607ee4eb77e",25,["D",1788813686965],"# PayAna Falsifier Agent Skill\n\n## Purpose\n\nPayAna is an evidence-first market-analysis agent for Binance Agent OS. Its job is **not** to predict a guaranteed direction and **not** to place trades. It observes market evidence, constructs competing hypotheses, searches for disconfirming evidence, records what is missing, and returns a decision-quality briefing.\n\nThe skill is designed for an MCP-capable AI client connected to the official Binance Agent OS MCP endpoint:\n\n`https://agent.binance.com/mcp/agentic`\n\nUse the minimum permission set required. For this skill, **Market Data only** is sufficient. Account, Trade, Transfer and withdrawal-like capabilities are outside the skill's required scope.\n\n## Hard safety boundary\n\n- `MARKET_DATA_READ != TRADING_AUTH`\n- Never request or enable Trade, Account or Transfer merely to complete this workflow.\n- Never place, simulate-as-real, confirm or recommend an order.\n- Never claim an MCP call occurred unless the tool receipt proves it.\n- Never treat model confidence as a calibrated probability.\n- Never treat a screenshot, HTTP 200, API field named `open`, or plausible prose as economic proof.\n- If one required source fails, mark the run `PARTIAL`; if all required sources fail, mark it `FAIL`.\n\n## Supported market evidence\n\nFor the requested Binance spot symbol, retrieve when available:\n\n1. 24h ticker: last price, 24h change, high, low, quote volume, trade count.\n2. Order book: at least top 20 bid and ask levels.\n3. 5m candlesticks: at least 36 candles when available.\n4. Funding/mark price only when exposed by the connected Agent OS market-data tool. Absence must be recorded, not imputed.\n\n## Loop\n\nRun this reasoning loop once per user request or monitoring cycle:\n\n1. **OBSERVE** — collect fresh market evidence and timestamps.\n2. **VALIDATE** — verify symbol, source success, timestamps, numeric bounds and non-empty data.\n3. **MODEL** — calculate descriptive metrics.\n4. **NEURON** — create at least three branches:\n - winning hypothesis supported by current evidence;\n - opposite hypothesis;\n - alternative/non-directional explanation such as noise, liquidity effects or stale/missing context.\n5. **FALSIFY** — define observable conditions that would invalidate each hypothesis.\n6. **NEGATIVE SPACE** — explicitly list context not available to the run.\n7. **RECONCILE** — choose the best current descriptive label, not a trade direction.\n8. **RECEIPT** — return source/tool receipts and timestamp.\n9. **NEXT TEST** — state what evidence should be checked next if the user wants to continue.\n\n## Deterministic metrics\n\nUse formulas equivalent to the reference implementation when raw inputs exist:\n\n- `spread_bps = (ask - bid) / mid * 10000`\n- `bid_notional = Σ(price_i * qty_i)` over top-20 bids\n- `ask_notional = Σ(price_i * qty_i)` over top-20 asks\n- `book_imbalance = (bid_notional - ask_notional) / (bid_notional + ask_notional)`\n- `log_return_t = ln(close_t / close_(t-1))`\n- `realized_vol_5m_bps = sample_std(log_returns) * 10000`\n- `momentum_30m_pct = (latest_close / close_30m_ago - 1) * 100`\n- `momentum_3h_pct = (latest_close / first_close_in_3h_window - 1) * 100`\n- `volume_z = (latest_quote_volume - mean(prior_quote_volumes)) / sample_std(prior_quote_volumes)`\n\nReference descriptive score:\n\n`directional_score = mean(tanh(2*book_imbalance), tanh(momentum_30m_pct/0.6), tanh(momentum_3h_pct/1.5))`\n\nThis score is a heuristic descriptor, not a probability and not a price forecast.\n\n## Output contract\n\nReturn a compact object or briefing with these fields:\n\n- `symbol`\n- `evidence_state`: `PASS | PARTIAL | FAIL`\n- `fetched_at`\n- `observations`\n- `descriptive_pressure`: `BULLISH_PRESSURE | BEARISH_PRESSURE | MIXED_NEUTRAL`\n- `supporting_evidence[]`\n- `opposing_evidence[]`\n- `alternative_explanations[]`\n- `falsifiers[]`\n- `risk_flags[]`\n- `missing_context[]`\n- `source_receipts[]`\n- `recommendation`: always `NO_TRADE_DECISION` for this skill\n- `next_test`\n\n## Example request\n\n\"Use Binance Agent OS market data to audit BTCUSDT. Tell me what the current evidence supports, what argues against it, what would falsify the reading, and what is missing. Do not trade.\"\n\n## Example acceptance criteria\n\nA run passes only if:\n\n- the symbol is explicit and validated;\n- at least one live source has a timestamp/currentness signal;\n- no missing source is silently replaced by fabricated data;\n- the opposite hypothesis and at least one alternative explanation are present;\n- falsifiers are observable rather than rhetorical;\n- source receipts are listed;\n- final recommendation remains `NO_TRADE_DECISION`.\n",[171],"cbfb3f08-588f-4628-839c-7ee2e80168fa","README.md","01a07d8d-933a-7578-bf59-383aad23cbb7",1,["D",1788812825403],"# React + Hono Starter\n\nA minimal starter template for building client-side React apps with a Hono\nbackend on Val Town. Click **Remix** to get your own copy.\n\n## Picking a starter\n\n| Starter | When to pick it |\n| --- | --- |\n| [`basic-html-starter`](https://www.val.town/x/templates/basic-html-starter) | Static HTML pages. Sprinkle of vanilla JS. No server-side rendering. |\n| [`hono-jsx-starter`](https://www.val.town/x/templates/hono-jsx-starter) | Dynamic server-rendered HTML with JSX. API routes. No React, no SPA. |\n| **[`react-hono-starter`](https://www.val.town/x/templates/react-hono-starter)** *(you're here)* | Client-side React SPA with a Hono API backend. |\n\n**Want to build UI?** Start writing React components in\n[`frontend/components/`](/frontend/components/). Import them into `App.tsx` and\nyou're good to go. Styling is [Twind](https://twind.style/) — just use Tailwind\nutility classes, zero config.\n\n**Want to add an API?** Add routes in [`index.ts`](/index.ts) (there's a\ncommented-out example). Fetch them from your React components.\n\n## Architecture\n\n```mermaid\ngraph LR\n Browser -->|\"GET /\"| Hono[\"index.ts
(Hono server)\"]\n Hono -->|serves| HTML[\"root.tsx\"]\n HTML -->|loads| Entry[\"index.tsx\"]\n Entry -->|renders| App[\"App.tsx\"]\n App -->|renders| Counter[\"Counter.tsx\"]\n```\n\n## File structure\n\n```\nindex.ts ← Hono backend (serves frontend + API routes)\nfrontend/\n root.tsx ← HTML shell (stamps immutable asset URLs)\n index.tsx ← React entrypoint (mounts )\n favicon.svg ← App icon\n components/\n App.tsx ← Root component (layout + view source link)\n Counter.tsx ← Example component with state\n```\n\n## How it works\n\n1. **`index.ts`** is the HTTP entrypoint — a Hono server that serves the\n frontend and any API routes you add.\n2. **`frontend/root.tsx`** is the HTML shell — it loads Twind and stamps\n immutable asset URLs for the favicon and React entrypoint.\n3. **`frontend/index.tsx`** mounts the React app.\n4. **`frontend/components/App.tsx`** is the root layout — add new components\n alongside it.\n5. **`frontend/components/Counter.tsx`** is an example stateful component —\n replace it with your own!\n\n## Next steps\n\n- Add API routes in `index.ts`\n- Add new components in `frontend/components/`\n- Add a SQLite database — see the\n [React Hono Example](https://www.val.town/x/stevekrouse/reactHonoExample) for\n a full-stack example with database, queries, and shared types\n\nTemplate updates and upgrade paths for existing remixes: [CHANGELOG.md](/CHANGELOG.md)\n",[178],"c6dd6fa0-d085-4410-bdf7-9cc30f03963a","CHANGELOG.md","01a07d8d-933a-7578-bf59-362732c839bf",["D",1788812825403],"# Changelog\n\n## 2026-07-30 — Immutable asset caching\n\nFrontend files are now served at version-addressed URLs\n(`/__immutable/45/frontend/index.tsx`) with\n`Cache-Control: public, max-age=31536000, immutable`, so repeat visits load the\nwhole client graph from the browser cache — roughly 3× faster (~665ms → ~157ms\nmeasured). Publishing your val bumps its version, which changes every URL, so\ncaches invalidate automatically. Old-version URLs return 404 after a publish\n(like Next.js build assets); a reload picks up the new version.\n\nWhat changed in the template:\n\n- `frontend/index.html` → [`frontend/root.tsx`](/frontend/root.tsx): the HTML\n shell is now JSX and stamps asset URLs with `immutableFileUrl()`\n- [`index.ts`](/index.ts): serves `Root()` at `/`, and one\n `app.get(\"/__immutable/*\", (c) => serveImmutableFile(c.req.path))` route\n serves all frontend files\n\n### Upgrading an existing remix\n\nYour copy of this template doesn't update automatically. Two options:\n\n**Minimal (most of the benefit):** point both routes at `serveImmutableFile` —\nyour existing bare URLs redirect into versioned space, the new route serves\nthem, and the whole module graph gets cached (costs one redirect per page view):\n\n```ts\nimport { serveImmutableFile } from \"https://esm.town/v/std/utils/index.ts\";\n\napp.get(\"/__immutable/*\", (c) => serveImmutableFile(c.req.path));\napp.get(\"/frontend/**/*\", (c) => serveImmutableFile(c.req.path)); // was serveFile\n```\n\n**Full upgrade (also removes the redirect):** three self-contained steps —\nno other files needed. Adjust the ``, favicon, and body of `Root()` to\nmatch your app's existing `index.html`, and stamp anything else your shell\nreferences directly (images, css) with `immutableFileUrl()`.\n\n1. Create `frontend/root.tsx`:\n\n```tsx\n/** @jsxImportSource npm:hono@4/jsx */\nimport { raw } from \"npm:hono@4/html\";\nimport { immutableFileUrl } from \"https://esm.town/v/std/utils/index.ts\";\n\n// The HTML shell for the app. It is never cached, so immutableFileUrl can stamp\n// the current val version into each asset URL — the browser caches those\n// immutably, and publishing the val changes the URLs, refetching exactly once.\nexport function Root() {\n return (\n <>\n {raw(\"<!DOCTYPE html>\")}\n <html lang=\"en\">\n <head>\n <meta charSet=\"UTF-8\" />\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\" />\n <title>React Hono Val Town Starter\n

Diff · v34