[{"_1":2,"_3":-5,"_4":-5},"loaderData",{"_5":6,"_7":8},"actionData","errors","root",{"_114":115,"_116":117},"routes/embed.x.$handle.$name.$",{"_9":10,"_11":12,"_13":14,"_15":16,"_17":18,"_19":20,"_21":-5},"handle","stevekrouse","name","deepseek-v41-flash-benchmark","path","frontend/components/ProviderTable.tsx","project",{"_22":49,"_11":12,"_35":50,"_51":-5,"_52":44,"_53":54,"_55":54,"_56":57,"_58":-5,"_59":60,"_61":62,"_63":34,"_64":-5,"_65":-5,"_66":67,"_68":69,"_70":71,"_72":73,"_74":75,"_76":-5,"_77":78,"_79":78,"_80":81,"_82":81,"_83":81,"_84":78,"_85":78,"_86":87,"_88":89,"_90":91,"_92":44},"file",{"_22":23,"_11":24,"_25":26,"_27":28,"_29":30,"_31":32,"_33":34,"_35":36,"_37":38,"_39":40,"_41":42,"_43":44,"_45":-5,"_13":46},"permalink","https://www.val.town/x/stevekrouse/deepseek-v41-flash-benchmark/code/frontend/components/ProviderTable.tsx","extension","id","6e640468-0653-4c19-9f0e-a118104b2bc0","ProviderTable.tsx","fileId","01a08da5-899f-73ab-baf1-bd044989bc0b","parentId","01a08da5-899f-73ab-baf1-c4c2f323caa6","branchId","0cb5a767-9630-4119-a265-8c9f5f633c9a","branchVersion",72,"latest",true,"createdAt",["D",1789499420045],"version",10,"fileType","script","content","/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport {\n type ReactNode,\n useMemo,\n useState,\n} from \"https://esm.sh/react@18.2.0\";\nimport type { ProviderResult } from \"../../shared/types.ts\";\nimport {\n formatTtft,\n formatMoney,\n formatNumber,\n formatPercent,\n} from \"../format.ts\";\nimport { providerName } from \"../providers.ts\";\nimport { hourlySeries, type HourlyMetricKey } from \"../history.ts\";\nimport { InfoPopover } from \"./InfoPopover.tsx\";\nimport { Sparkline } from \"./Sparkline.tsx\";\nimport { ComplianceCell, RoutingSummary } from \"./StrategyCells.tsx\";\n\nfunction PlainHeader(props: { label: string; info: ReactNode }) {\n return (\n \n \n {props.label}\n {props.info}\n \n \n );\n}\n\ntype SortKey =\n | \"provider\"\n | \"successRate\"\n | \"p50TtftMs\"\n | \"p95TtftMs\"\n | \"p50TokensPerSecond\"\n | \"p05TokensPerSecond\"\n | \"cacheHitRate\"\n | \"effectiveCostPerMillionTokensUsd\";\ntype SortDirection = \"asc\" | \"desc\";\n\nfunction defaultDirection(key: SortKey): SortDirection {\n return key === \"successRate\" ||\n key === \"p50TokensPerSecond\" ||\n key === \"p05TokensPerSecond\" ||\n key === \"cacheHitRate\"\n ? \"desc\"\n : \"asc\";\n}\n\nfunction SortHeader(props: {\n label: string;\n sortKey: SortKey;\n activeKey: SortKey;\n direction: SortDirection;\n onSort: (key: SortKey) => void;\n info: ReactNode;\n align?: \"left\" | \"right\";\n}) {\n const active = props.activeKey === props.sortKey;\n return (\n \n \n props.onSort(props.sortKey)}\n className=\"flex h-full items-center gap-1.5 text-sm text-gray-600 hover:text-black\"\n >\n {props.label}\n \n {active ? props.direction === \"asc\" ? \"↑\" : \"↓\" : \"↕\"}\n \n \n {props.info}\n \n \n );\n}\n\nexport function ProviderTable(\n { providers, emptyMessage }: {\n providers: ProviderResult[];\n emptyMessage?: string;\n },\n) {\n const [sortKey, setSortKey] = useState(\"successRate\");\n const [direction, setDirection] = useState(\"desc\");\n\n function sortBy(key: SortKey) {\n if (key === sortKey) {\n setDirection((current) => current === \"asc\" ? \"desc\" : \"asc\");\n return;\n }\n setSortKey(key);\n setDirection(defaultDirection(key));\n }\n\n const sorted = useMemo(() => {\n return [...providers].sort((a, b) => {\n const aValue = sortKey === \"provider\"\n ? providerName(a.provider).toLocaleLowerCase()\n : a[sortKey];\n const bValue = sortKey === \"provider\"\n ? providerName(b.provider).toLocaleLowerCase()\n : b[sortKey];\n\n if (aValue === null && bValue === null) {\n return providerName(a.provider).localeCompare(providerName(b.provider));\n }\n if (aValue === null) return 1;\n if (bValue === null) return -1;\n\n const comparison = typeof aValue === \"string\"\n ? aValue.localeCompare(String(bValue))\n : Number(aValue) - Number(bValue);\n if (comparison === 0) {\n return providerName(a.provider).localeCompare(providerName(b.provider));\n }\n return direction === \"asc\" ? comparison : -comparison;\n });\n }, [providers, sortKey, direction]);\n\n return (\n

\n \n \n \n Gateway provider pinned with only, or a routing strategy (a set of providerOptions.gateway hints). Sorted alphabetically.

}\n />\n Zero data retention: the provider has agreed with Vercel not to retain prompts or completions (has_zdr in the Gateway endpoint catalogue). Strategies request this with zeroDataRetention: true, so the gateway only routes to ✓ providers.

}\n />\n The provider has agreed not to train on prompts (has_no_training in the Gateway endpoint catalogue). Strategies request this with disallowPromptTraining: true.

}\n />\n Higher is better. Successful requests divided by all attempted requests. The sparkline shows the average success rate per hour over time.

}\n />\n Lower is better. Median time to first text across successful requests. The sparkline shows the hourly average over time.

}\n />\n Lower is better. The 95th percentile of time to first text across successful requests, calculated with nearest rank. The sparkline shows the hourly average over time.

}\n />\n Higher is better. Median generation throughput: all output tokens (reasoning included) ÷ (stream end − first streamed delta). Responses delivered in fewer than 3 chunks or a <100 ms window were buffered, not streamed, and are excluded rather than reported as absurdly fast. The sparkline shows the hourly average over time.

}\n />\n Higher is better. The slow throughput tail: the 5th percentile of output tokens ÷ (stream end − first streamed delta) across successful, genuinely streamed requests. The sparkline shows the hourly average over time.

}\n />\n Higher is better. Cache hits divided by eligible successful repeats. The first successful request for each provider in each run is warmup and excluded. The sparkline shows the average cache hit rate per hour over time.

}\n />\n \n

Lower is better. MTok means one million tokens.

\n \n Σ observed request cost\n Σ (input tokens + output tokens)\n × 1,000,000\n \n

Only successful requests with complete cost and usage telemetry are included. Cached tokens remain in input; their discount is reflected in observed cost. The sparkline shows the hourly average over time.

\n \n )}\n />\n \n \n \n {sorted.map((provider) => {\n const href = \"/measurements?provider=\" +\n encodeURIComponent(provider.provider);\n const history = provider.history ?? [];\n const hourly = (key: HourlyMetricKey) =>\n hourlySeries(history, key);\n return (\n {\n const target = event.target as HTMLElement;\n if (target.closest(\"a, button\")) return;\n if (window.getSelection()?.toString()) return;\n if (event.metaKey || event.ctrlKey) {\n window.open(href, \"_blank\", \"noopener,noreferrer\");\n return;\n }\n window.location.assign(href);\n }}\n onAuxClick={(event) => {\n if (event.button !== 1) return;\n window.open(href, \"_blank\", \"noopener,noreferrer\");\n }}\n className=\"cursor-pointer border-b border-gray-200 last:border-b-0 hover:bg-gray-50\"\n >\n \n \n \n \n \n \n \n \n \n \n \n );\n })}\n \n

\n \n {providerName(provider.provider)}\n \n {provider.kind === \"strategy\" && (\n \n )}\n	\n \n {formatPercent(provider.successRate)}\n formatPercent(value)}\n caption=\"Average success rate grouped by hour\"\n />\n \n	\n \n {formatTtft(provider.p50TtftMs)}\n \n \n	\n \n {formatTtft(provider.p95TtftMs)}\n \n \n	\n \n {formatNumber(provider.p50TokensPerSecond)}\n \n \n	\n \n {formatNumber(provider.p05TokensPerSecond)}\n \n \n	\n \n {formatPercent(provider.cacheHitRate)}\n formatPercent(value)}\n caption=\"Average cache hit rate grouped by hour\"\n />\n \n	\n \n \n {formatMoney(provider.effectiveCostPerMillionTokensUsd)}\n \n \n \n

\n {providers.length === 0 && (\n

\n {emptyMessage ?? \"No completed benchmark results yet.\"}\n

\n )}\n

\n );\n}\n","deleted",false,"label",[47,48,24],"frontend","components","1ea4658b-1977-4a2c-8356-9d6ab6609397",["D",1789082831202],"deletedAt","legacyEnvVars","privacy","public","httpPrivacy","description","Run and compare AI Gateway providers for deepseek-v4.1-flash","imageUrl","userId","a0bf3b31-15a5-4d5c-880e-4b1e22c9bc18","pinnedFileId","01a08da5-899f-73ab-baf1-f0227ea1ff9b","pinPreview","pinMigrated","screenshotVersion","likeCount",0,"orgId","e81e7335-6d4c-4764-a902-d0962bbfa9f7","tursoName","1ea4658b19774a2c83569d6ab6609397","tursoHostname","1ea4658b19774a2c83569d6ab6609397-val-town.aws-us-east-2.turso.io","tursoMeasuredAt",["D",1789518676100],"pinned","userPerm","r","valPerm","blobPerm","rw","emailPerm","sqlitePerm","projectPerm","telemetryPerm","user",{"_9":10,"_113":109},"org",{"_9":10,"_107":-5,"_108":109,"_59":60,"_110":111,"_112":44},"branch",{"_37":93,"_11":94,"_22":30,"_95":49,"_96":97,"_98":99,"_100":54,"_101":102,"_103":104,"_105":12,"_106":10},"isOwned",81,"main","projectId","forkedBranchId","24cb14b4-1851-4548-adc6-43a574860a3d","forkedBranchVersion",322,"forkedProjectPrivacy","forkedProjectId","d055324c-28f9-4529-80dd-e9bbfbdbeb65","forkedProjectOrgId","ba7bb5fb-1abb-4ffb-8f3d-7c244782e5f7","projectName","userHandle","displayName","avatar","https://images.clerk.dev/uploaded/img_2PqHa2Gsy93xQrjh2w78Xu0cChW.jpeg","tier","pro","canRestrictVals","profileImageUrl","ctx",{"_86":-5,"_147":148,"_149":150,"_151":152,"_153":44,"_154":44,"_155":44,"_156":34,"_157":-5,"_158":-7,"_159":-7,"_160":67,"_161":44,"_162":44,"_163":-5,"_164":44,"_165":44,"_166":44,"_167":-5},"ENV",{"_118":119,"_120":121,"_122":94,"_123":124,"_125":126,"_127":128,"_129":130,"_131":132,"_133":134,"_135":136,"_137":138,"_139":140,"_141":142,"_143":144,"_145":146},"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","orgs",[],"preferencesKeybindings","default","preferencesTheme","light","preferencesFixers","preferencesCopilot","preferencesSelectionAi","preferencesCloseBrackets","preferencesChatPanelState","preferencesDprint","preferencesDenofmt","notificationCount","flagDenols","isBusinessOrgMember","businessOrgHandle","isBusinessOrgAdmin","isHigherTownieTier","navCollapsed","currentOrgId"]