"""Explore the SaylorTwift/llm-benchmark-usage dataset: which benchmarks are used, when they emerged, which models (open/closed) report them, how benchmark categories have evolved over time, and where to find each benchmark's HF dataset / implementation. Categories, modality, and language come from the dataset's `benchmarks` reference table (a controlled vocabulary), not from free-text per-source labels — coverage of that table is partial, so benchmarks without a matching row fall into `uncategorized`. The whole UI is built from `gr.HTML`: custom HTML input components (pills, select, range, search) subclassed from gr.HTML, and server-rendered HTML/SVG for every table, card, and chart. No Dataframe/Dropdown/Radio/Slider/Plot components. """ print("app.py: starting imports...", flush=True) import html as html_lib import math from urllib.parse import urlparse import gradio as gr import pandas as pd from data import CATEGORY_ORDER, load_data print("app.py: imports done, loading data...", flush=True) MODELS_DF, USAGE_DF, BENCH_META = load_data() print("app.py: data loaded, building UI...", flush=True) ALL_BENCHMARKS = sorted(USAGE_DF["benchmark"].unique()) ALL_MODELS = sorted(USAGE_DF["model_id"].unique()) ALL_CATEGORIES = sorted(USAGE_DF["category"].unique()) PERIODS = sorted(MODELS_DF["period"].unique()) def esc(s) -> str: return html_lib.escape(str(s), quote=True) # --------------------------------------------------------------------------- # Styles. Category/openness colors are defined once as CSS variables (with # dark-mode steps under `.dark`, which Gradio toggles on the page), and every # chart mark and chip references them, so both themes come from one place. # --------------------------------------------------------------------------- CUSTOM_CSS = """ :root { --cat-knowledge: #2a78d6; --cat-coding: #1baf7a; --cat-agentic: #eda100; --cat-reasoning: #0a9b9b; --cat-math: #4f7d00; --cat-perception: #e34948; --cat-long_context: #eb6834; --cat-instruction_following: #c2489d; --cat-commonsense: #8a6d3b; --cat-domain_specific: #5b6ee1; --cat-alignment: #4a3aa7; --cat-safety: #a33a52; --cat-translation: #e87ba4; --cat-writing: #8a7000; --cat-uncategorized: #86847d; --open: #2a78d6; --closed: #e34948; --accent: #2a78d6; } /* Gradio sets the light theme variables on and the dark ones on .gradio-container, and var() resolves where a property is DEFINED — so these aliases must live on .gradio-container to pick up the active theme. */ .gradio-container { --ink: var(--body-text-color, #0b0b0b); --muted: var(--body-text-color-subdued, #898781); --surf: var(--background-fill-primary, #fcfcfb); --hair: var(--border-color-primary, #e1e0d9); --grid: color-mix(in srgb, var(--hair) 55%, transparent); } .dark { --cat-knowledge: #3987e5; --cat-coding: #199e70; --cat-agentic: #c98500; --cat-reasoning: #12b8b8; --cat-math: #6ea600; --cat-perception: #e66767; --cat-long_context: #d95926; --cat-instruction_following: #d55eae; --cat-commonsense: #a68753; --cat-domain_specific: #7a8bf0; --cat-alignment: #9085e9; --cat-safety: #c2536b; --cat-translation: #d55181; --cat-writing: #b39400; --cat-uncategorized: #898781; --open: #3987e5; --closed: #e66767; --accent: #3987e5; } /* Gradio 6's theme cascades flex-grow:1 from .gradio-container down through .main.fillable.app -> .wrap -> main.contain, stretching the whole app shell to the viewport height regardless of actual content height. Force those containers back to their natural height. */ .gradio-container, .main.fillable.app, .wrap.svelte-zxu34v, main.contain.svelte-zxu34v { flex-grow: 0 !important; height: auto !important; } /* --- hero ------------------------------------------------------------- */ .hero h1 { font-size: 26px; margin: 4px 0 6px; color: var(--ink); } .hero p { color: var(--muted); font-size: 14px; margin: 0; } .hero a { color: var(--accent); } .tiles { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 14px; } .tile { flex: 1; min-width: 150px; border: 1px solid var(--hair); border-radius: 10px; padding: 10px 14px; background: var(--surf); } .tile .lab { font-size: 12px; color: var(--muted); } .tile .val { font-size: 26px; font-weight: 600; color: var(--ink); } .tile .val.sm { font-size: 15px; padding-top: 8px; } /* --- controls ---------------------------------------------------------- */ .ctl { display: flex; flex-direction: column; gap: 6px; margin: 2px 0 8px; } .ctl-label { font-size: 12px; font-weight: 600; color: var(--muted); } .pillrow { display: flex; flex-wrap: wrap; gap: 6px; } .pill { border: 1px solid var(--hair); background: transparent; color: var(--ink); border-radius: 999px; padding: 5px 12px; font-size: 12.5px; cursor: pointer; } .pill:hover { border-color: var(--accent); } .pill.on { background: var(--accent); border-color: var(--accent); color: #fff; } .cbx-wrap { position: relative; max-width: 460px; } input.cbx-input { width: 100%; box-sizing: border-box; padding: 7px 30px 7px 10px; border: 1px solid var(--hair); border-radius: 8px; background: var(--surf); color: var(--ink); font-size: 13px; } input.cbx-input:focus { outline: none; border-color: var(--accent); } .cbx-caret { position: absolute; right: 10px; top: 50%; transform: translateY(-50%); color: var(--muted); pointer-events: none; font-size: 11px; } .cbx-list { position: absolute; top: calc(100% + 4px); left: 0; right: 0; max-height: 320px; overflow: auto; background: var(--surf); border: 1px solid var(--hair); border-radius: 8px; z-index: 100; box-shadow: 0 6px 18px rgba(0, 0, 0, .15); } .cbx-item { padding: 7px 10px; font-size: 13px; color: var(--ink); cursor: pointer; } .cbx-item:hover, .cbx-item.active { background: color-mix(in srgb, var(--accent) 14%, transparent); } .cbx-item.sel { font-weight: 600; } .cbx-empty { padding: 8px 10px; color: var(--muted); font-size: 12.5px; } .sliderrow { display: flex; align-items: center; gap: 10px; } input.ctl-range { accent-color: var(--accent); width: 200px; max-width: 100%; } .ctl-range-val { font-size: 13px; font-weight: 600; color: var(--ink); min-width: 2ch; } input.ctl-search, input.tbl-filter { padding: 7px 10px; border: 1px solid var(--hair); border-radius: 8px; background: var(--surf); color: var(--ink); font-size: 13px; width: 230px; } /* --- cards, chips, notes ------------------------------------------------ */ .tab-note { color: var(--muted); font-size: 13.5px; margin: 2px 0 10px; } .card { border: 1px solid var(--hair); border-radius: 10px; padding: 12px 16px; background: var(--surf); margin: 4px 0 10px; } .card-title { font-size: 17px; font-weight: 600; color: var(--ink); margin-bottom: 4px; } .card-sub { color: var(--muted); font-size: 13px; line-height: 1.7; } .card-sub strong { color: var(--ink); font-weight: 600; } .card-sub a { color: var(--accent); } .chip { display: inline-flex; align-items: center; gap: 5px; padding: 2px 9px; border: 1px solid var(--hair); border-radius: 999px; font-size: 11.5px; margin: 2px 4px 2px 0; color: var(--muted); white-space: nowrap; } .chip i { width: 8px; height: 8px; border-radius: 50%; display: inline-block; flex: none; } .rel-hd { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; } .rel-name { font-size: 15px; font-weight: 600; color: var(--ink); } .rel-meta { color: var(--muted); font-size: 12.5px; margin-left: auto; } .rel-chips { margin-top: 8px; } .rel-src { color: var(--muted); font-size: 12.5px; margin-top: 6px; } .rel-src a { color: var(--accent); } .cat-sec { margin: 10px 0 14px; } .cat-hd { display: flex; align-items: center; gap: 7px; font-size: 13.5px; font-weight: 600; color: var(--ink); margin-bottom: 6px; } .cat-hd i { width: 10px; height: 10px; border-radius: 50%; display: inline-block; } .cat-hd .n { color: var(--muted); font-weight: 400; } /* --- tables ------------------------------------------------------------- */ .tbl-tools { margin: 2px 0 8px; } .tbl-wrap { max-height: 480px; overflow: auto; border: 1px solid var(--hair); border-radius: 8px; } .tbl { width: 100%; border-collapse: collapse; font-size: 13px; color: var(--ink); } .tbl thead th { position: sticky; top: 0; z-index: 1; background: var(--surf); text-align: left; padding: 8px 10px; border-bottom: 1px solid var(--hair); color: var(--muted); font-weight: 600; white-space: nowrap; } .tbl td { padding: 7px 10px; border-bottom: 1px solid var(--hair); vertical-align: middle; } .tbl tbody tr:last-child td { border-bottom: none; } .tbl tbody tr:hover { background: color-mix(in srgb, var(--ink) 5%, transparent); } .tbl .num { font-variant-numeric: tabular-nums; text-align: right; } .tbl .mut { color: var(--muted); font-size: 12.5px; white-space: nowrap; } .tbl a { color: var(--accent); text-decoration: none; } .tbl a:hover { text-decoration: underline; } .match-note { color: var(--muted); font-size: 12.5px; margin: 6px 2px; } .cellbar { display: inline-block; vertical-align: middle; width: 110px; height: 8px; background: color-mix(in srgb, var(--ink) 7%, transparent); border-radius: 4px; overflow: hidden; margin-left: 8px; } .cellbar span { display: block; height: 100%; background: var(--accent); border-radius: 0 4px 4px 0; } .splitbar { display: inline-flex; vertical-align: middle; width: 90px; height: 8px; gap: 2px; margin-left: 8px; } .splitbar .o { background: var(--open); height: 100%; border-radius: 4px 0 0 4px; } .splitbar .c { background: var(--closed); height: 100%; border-radius: 0 4px 4px 0; } /* --- charts ------------------------------------------------------------- */ .viz-title { font-size: 14px; font-weight: 600; color: var(--ink); margin: 8px 2px 2px; } .legend { display: flex; gap: 16px; flex-wrap: wrap; margin: 6px 2px 8px; font-size: 12px; color: var(--muted); } .legend .key { display: inline-flex; gap: 6px; align-items: center; } .legend .key i { width: 10px; height: 10px; border-radius: 3px; display: inline-block; } .legend .key i.round { border-radius: 50%; } .viz { width: 100%; height: auto; display: block; } .viz text { font-family: system-ui, -apple-system, "Segoe UI", sans-serif; } .viz .dot { transition: r .1s; } .viz .dot:hover { r: 7.5px; } .viz .seg:hover { opacity: .82; } """ # --------------------------------------------------------------------------- # Custom HTML input components (replace Radio / Dropdown / Slider / Textbox) # --------------------------------------------------------------------------- class PillGroup(gr.HTML): """Single-select pill buttons (replaces gr.Radio).""" def __init__(self, options, value, label, **kwargs): super().__init__( value=value, options=list(options), label_text=label, html_template="""
${label_text}
${options.map(o => ``).join('')}
""", js_on_load=""" element.addEventListener('click', (e) => { const btn = e.target.closest('.pill'); if (!btn) return; props.value = btn.dataset.v; trigger('change'); });""", **kwargs, ) def api_info(self): return {"type": "string"} class SelectBox(gr.HTML): """Type-to-filter combobox (replaces gr.Dropdown with filterable=True): a text input that opens a filtered option list, with arrow/Enter/Escape keyboard support. All listeners are delegated on the component root so they survive the re-render that follows each value sync.""" def __init__(self, options, value, label, **kwargs): super().__init__( value=value, options=list(options), label_text=label, html_template="""
${label_text}
""", js_on_load=""" const list = () => element.querySelector('.cbx-list'); const input = () => element.querySelector('.cbx-input'); const items = () => [...element.querySelectorAll('.cbx-item')]; const visible = () => items().filter(it => !it.hidden); function open(showAll) { if (showAll) { items().forEach(it => { it.hidden = false; }); element.querySelector('.cbx-empty').hidden = true; } list().hidden = false; input().setAttribute('aria-expanded', 'true'); } function close(restore) { list().hidden = true; input().setAttribute('aria-expanded', 'false'); items().forEach(it => it.classList.remove('active')); if (restore) input().value = props.value; } function applyFilter() { const q = input().value.toLowerCase(); let any = false; items().forEach(it => { it.hidden = !it.textContent.toLowerCase().includes(q); it.classList.remove('active'); if (!it.hidden) any = true; }); element.querySelector('.cbx-empty').hidden = any; } function move(dir) { const vis = visible(); if (!vis.length) return; const cur = vis.findIndex(it => it.classList.contains('active')); const next = Math.min(Math.max(cur + dir, 0), vis.length - 1); vis.forEach(it => it.classList.remove('active')); vis[next].classList.add('active'); vis[next].scrollIntoView({ block: 'nearest' }); } function pick(v) { close(false); props.value = v; trigger('change'); } element.addEventListener('focusin', (e) => { if (!e.target.classList.contains('cbx-input')) return; e.target.select(); open(true); }); element.addEventListener('input', (e) => { if (!e.target.classList.contains('cbx-input')) return; open(false); applyFilter(); }); element.addEventListener('keydown', (e) => { if (!e.target.classList.contains('cbx-input')) return; if (e.key === 'ArrowDown') { e.preventDefault(); if (list().hidden) open(true); move(1); } else if (e.key === 'ArrowUp') { e.preventDefault(); move(-1); } else if (e.key === 'Enter') { e.preventDefault(); const target = visible().find(it => it.classList.contains('active')) || visible()[0]; if (target) pick(target.dataset.v); } else if (e.key === 'Escape') { close(true); e.target.blur(); } }); element.addEventListener('pointerdown', (e) => { const it = e.target.closest('.cbx-item'); if (!it) return; e.preventDefault(); // beat the input's blur pick(it.dataset.v); }); element.addEventListener('focusout', (e) => { if (!element.contains(e.relatedTarget)) close(true); });""", **kwargs, ) def api_info(self): return {"type": "string"} class RangeSlider(gr.HTML): """Native range input with a value readout (replaces gr.Slider).""" def __init__(self, minimum, maximum, value, step, label, **kwargs): super().__init__( value=value, minimum=minimum, maximum=maximum, step=step, label_text=label, html_template="""
${label_text}
${value}
""", js_on_load=""" element.addEventListener('input', (e) => { if (!e.target.classList.contains('ctl-range')) return; const out = element.querySelector('.ctl-range-val'); if (out) out.textContent = e.target.value; }); element.addEventListener('change', (e) => { if (!e.target.classList.contains('ctl-range')) return; props.value = Number(e.target.value); trigger('change'); });""", **kwargs, ) def api_info(self): return {"type": "integer"} class SearchBox(gr.HTML): """Debounced text search (replaces gr.Textbox). Focus is restored after the value-sync re-render so typing isn't interrupted.""" def __init__(self, value, label, placeholder, **kwargs): super().__init__( value=value, label_text=label, placeholder=placeholder, html_template="""
${label_text}
""", js_on_load=""" let t = null; element.addEventListener('input', (e) => { if (!e.target.classList.contains('ctl-search')) return; clearTimeout(t); const v = e.target.value; t = setTimeout(() => { props.value = v; trigger('change'); setTimeout(() => { const inp = element.querySelector('.ctl-search'); if (inp && document.activeElement !== inp) { inp.focus(); inp.setSelectionRange(inp.value.length, inp.value.length); } }, 60); }, 250); });""", **kwargs, ) def api_info(self): return {"type": "string"} # Client-side row filter for rendered tables: filters rows against the # .tbl-filter input, no server round trip. Attached via js_on_load so the # delegated listener survives value updates. TABLE_FILTER_JS = """ element.addEventListener('input', (e) => { if (!e.target.classList.contains('tbl-filter')) return; const q = e.target.value.toLowerCase(); element.querySelectorAll('tbody tr').forEach(tr => { tr.style.display = tr.textContent.toLowerCase().includes(q) ? '' : 'none'; }); });""" # --------------------------------------------------------------------------- # Small HTML helpers # --------------------------------------------------------------------------- def cat_chip(category: str) -> str: return f'{esc(category)}' def plain_chip(text: str) -> str: return f'{esc(text)}' def benchmark_meta_block(benchmark: str) -> str: """Description + categories/modality/language + paper/implementation links for a benchmark, pulled from the dataset's `benchmarks` reference table. That table only covers a subset of all referenced names, so this degrades gracefully.""" info = BENCH_META.get(benchmark) if not info: return '
No reference metadata catalogued for this benchmark yet.
' chips = "".join(cat_chip(c) for c in info["categories"]) chips += "".join(plain_chip(m) for m in info["modality"]) chips += "".join(plain_chip(l) for l in info["language"]) links = " · ".join( f'{label}' for label, url in [("Paper", info["paper_url"]), ("Implementation", info["implementation_url"])] if url ) return ( f'
{esc(info["description"])}
' f'
{chips}
' + (f'
{links}
' if links else "") ) def openness_chip(is_open: bool) -> str: color, text = ("var(--open)", "open") if is_open else ("var(--closed)", "closed") return f'{text}' def source_label(url: str) -> str: """The dataset no longer carries a source title/type, just a link — show its host as a short, still-meaningful label (e.g. "arxiv.org", "huggingface.co").""" return urlparse(url).netloc or url def nice_ceil(v: float) -> float: if v <= 0: return 1 exp = 10 ** math.floor(math.log10(v)) frac = v / exp for m in (1, 2, 2.5, 5, 10): if frac <= m: return m * exp return v def month_ticks(t0: pd.Timestamp, t1: pd.Timestamp) -> list[pd.Timestamp]: span = max((t1 - t0).days, 1) step = next((s for s in (1, 2, 3, 6, 12, 24) if span / (30.4 * s) <= 7), 24) m0 = ((t0.month - 1) // step) * step + 1 d = pd.Timestamp(year=t0.year, month=m0, day=1) ticks = [] while d <= t1: if d >= t0: ticks.append(d) total = (d.month - 1) + step d = pd.Timestamp(year=d.year + total // 12, month=total % 12 + 1, day=1) return ticks # --------------------------------------------------------------------------- # Hero header # --------------------------------------------------------------------------- def render_hero() -> str: d0, d1 = MODELS_DF["release_date"].min().date(), MODELS_DF["release_date"].max().date() n_bench = USAGE_DF["benchmark"].nunique() tiles = [ ("Models", str(len(MODELS_DF)), ""), ("Labs", str(MODELS_DF["lab"].nunique()), ""), ("Distinct benchmarks", str(n_bench), ""), ("Catalogued", f"{len(BENCH_META)} / {n_bench}", "sm"), ("Coverage", f"{d0} → {d1}", "sm"), ] tiles_html = "".join( f'
{esc(lab)}
{esc(val)}
' for lab, val, cls in tiles ) return ( '

LLM Benchmark Usage Explorer

' '

Exploring SaylorTwift/llm-benchmark-usage — which benchmarks labs report, ' "who uses them, and how the mix shifts over time. Categories/modality/language come " 'from a reference table that only ' "partially covers all referenced benchmarks — the rest show as " "uncategorized.

" f'
{tiles_html}
' ) # --------------------------------------------------------------------------- # Tab 0: Latest releases (landing view) # --------------------------------------------------------------------------- def rel_date(d: pd.Timestamp) -> str: days = (pd.Timestamp.now().normalize() - d.normalize()).days if days <= 0: return "today" if days == 1: return "yesterday" if days < 7: return f"{days} days ago" if days < 60: return f"{days // 7} week{'s' if days >= 14 else ''} ago" if days < 365: return f"{days // 30} months ago" return f"{days // 365} year{'s' if days >= 730 else ''} ago" MAX_RELEASE_CHIPS = 16 def latest_releases_view(count) -> str: recent = MODELS_DF.sort_values("release_date", ascending=False).head(int(count)) cat_rank = {c: i for i, c in enumerate(CATEGORY_ORDER)} cards = [] for m in recent.itertuples(): sub = USAGE_DF[USAGE_DF["model_id"] == m.model_id] if sub.empty: body = '
No benchmark data recorded for this model.
' else: # A benchmark can span >1 category now, so collect them all per benchmark # before picking a single chip color (lowest-ranked category wins). per_bench = sub.groupby("benchmark")["category"].apply( lambda s: sorted(set(s), key=lambda c: cat_rank.get(c, 99)) ) per_bench = per_bench.reset_index(name="categories") per_bench["rank"] = per_bench["categories"].apply(lambda cs: cat_rank.get(cs[0], 99)) per_bench = per_bench.sort_values(["rank", "benchmark"]) shown = per_bench.head(MAX_RELEASE_CHIPS) chips = "".join( f'' f'{esc(r.benchmark)}' for r in shown.itertuples() ) if len(per_bench) > MAX_RELEASE_CHIPS: chips += f'+{len(per_bench) - MAX_RELEASE_CHIPS} more' src_url = sub.iloc[0]["source"] body = ( f'
{chips}
' f'
{len(per_bench)} benchmarks · Source: ' f'{esc(source_label(src_url))}
' ) cards.append( f'
' f'{esc(m.model_id)}' f"{openness_chip(bool(m.is_open))}" f'{esc(m.lab)} · {m.release_date.date()} · {rel_date(m.release_date)}' f"
{body}
" ) return "".join(cards) # --------------------------------------------------------------------------- # Tab 1: Benchmark popularity # --------------------------------------------------------------------------- def popularity_view(category_filter, openness_filter, min_models, search) -> str: df = USAGE_DF if category_filter and category_filter != "All": df = df[df["category"] == category_filter] if openness_filter == "Open only": df = df[df["is_open"]] elif openness_filter == "Closed only": df = df[~df["is_open"]] # A model can appear several times for one benchmark (multiple sources report # it), so count on deduplicated (benchmark, model) pairs; categories keep all rows. uniq = df.drop_duplicates(subset=["benchmark", "model_id"]) agg = ( uniq.groupby("benchmark") .agg( models=("model_id", "nunique"), open_models=("is_open", "sum"), first_seen=("release_date", "min"), last_seen=("release_date", "max"), labs=("lab", "nunique"), ) .reset_index() ) categories = df.groupby("benchmark")["category"].agg(lambda s: sorted(set(s))).rename("categories") agg = agg.merge(categories, on="benchmark") agg["closed_models"] = agg["models"] - agg["open_models"] agg = agg[agg["models"] >= int(min_models)] if search: agg = agg[agg["benchmark"].str.contains(search, case=False, na=False, regex=False)] agg = agg.sort_values(["models", "benchmark"], ascending=[False, True]) if agg.empty: return '
No benchmarks match the current filters.
' max_models = int(agg["models"].max()) rows = [] for i, r in enumerate(agg.itertuples(), start=1): bar_pct = r.models / max_models * 100 tot = max(r.models, 1) o_pct, c_pct = r.open_models / tot * 100, r.closed_models / tot * 100 chips = "".join(cat_chip(c) for c in r.categories) rows.append( f"" f'{i}' f"{esc(r.benchmark)}" f'{r.models}' f'{int(r.open_models)} / {int(r.closed_models)}' f'' f'' f'{r.labs}' f"{chips}" f'{r.first_seen.date()}' f'{r.last_seen.date()}' f"" ) return ( f'
{len(agg)} benchmarks match · sorted by number of models
' '
' "" "" f'{"".join(rows)}
#BenchmarkModelsOpen / closedLabsCategoriesFirst seenLast seen
' ) # --------------------------------------------------------------------------- # Tab 2: All benchmarks (catalog: usage count + HF dataset + implementation links) # --------------------------------------------------------------------------- MIN_CATALOG_MODELS = 3 # drop benchmarks used by 2 or fewer models CATALOG_STALE_MONTHS = 6 # drop benchmarks with no model release in this window def catalog_view(category_filter, sort_mode, search) -> str: df = USAGE_DF if category_filter and category_filter != "All": df = df[df["category"] == category_filter] uniq = df.drop_duplicates(subset=["benchmark", "model_id"]) agg = uniq.groupby("benchmark").agg( models=("model_id", "nunique"), last_seen=("release_date", "max") ).reset_index() categories = df.groupby("benchmark")["category"].agg(lambda s: sorted(set(s))).rename("categories") agg = agg.merge(categories, on="benchmark") # Drop rarely-used and stale benchmarks so the catalog stays focused on # benchmarks that are both adopted and still current. cutoff = pd.Timestamp.now() - pd.DateOffset(months=CATALOG_STALE_MONTHS) n_before = len(agg) agg = agg[(agg["models"] > MIN_CATALOG_MODELS - 1) & (agg["last_seen"] >= cutoff)] n_hidden = n_before - len(agg) if search: agg = agg[agg["benchmark"].str.contains(search, case=False, na=False, regex=False)] if sort_mode == "Category": cat_rank = {c: i for i, c in enumerate(CATEGORY_ORDER)} agg["_rank"] = agg["categories"].apply(lambda cs: cat_rank.get(cs[0], 99) if cs else 99) agg = agg.sort_values(["_rank", "benchmark"]) elif sort_mode == "Name (A-Z)": agg = agg.sort_values("benchmark") else: # "Most used" agg = agg.sort_values(["models", "benchmark"], ascending=[False, True]) hidden_note = ( f" · {n_hidden} niche/stale benchmark{'s' if n_hidden != 1 else ''} hidden " f"(≤{MIN_CATALOG_MODELS - 1} models or none in the last {CATALOG_STALE_MONTHS} months)" if n_hidden else "" ) if agg.empty: return f'
No benchmarks match the current filters.{esc(hidden_note)}
' max_models = int(agg["models"].max()) rows = [] for i, r in enumerate(agg.itertuples(), start=1): info = BENCH_META.get(r.benchmark) bar_pct = r.models / max_models * 100 chips = "".join(cat_chip(c) for c in r.categories) hf_dataset = info.get("hf_dataset") if info else None hf_url = f"https://huggingface.co/datasets/{hf_dataset}" if hf_dataset else None hf_cell = f'🤗 {esc(hf_dataset)}' if hf_url else '' impl_url = info.get("implementation_url") if info else None # Skip the implementation link when it's just the same HF dataset already shown. impl_cell = ( f'{esc(source_label(impl_url))}' if impl_url and impl_url != hf_url else '' ) rows.append( f"" f'{i}' f"{esc(r.benchmark)}" f'{r.models}' f"{chips}" f"{hf_cell}" f"{impl_cell}" f"" ) return ( f'
{len(agg)} benchmarks match · sorted by {esc(sort_mode.lower())}{esc(hidden_note)}
' '
' "" f'{"".join(rows)}
#BenchmarkModelsCategoriesHF datasetImplementation
' ) # --------------------------------------------------------------------------- # Tab 3: Benchmark -> Models (summary card, monthly-usage SVG bars, table) # --------------------------------------------------------------------------- def _rounded_top_rect(x, y, w, h, r) -> str: r = min(r, h / 2, w / 2) return ( f'M {x:.1f} {y + h:.1f} L {x:.1f} {y + r:.1f} Q {x:.1f} {y:.1f} {x + r:.1f} {y:.1f} ' f'L {x + w - r:.1f} {y:.1f} Q {x + w:.1f} {y:.1f} {x + w:.1f} {y + r:.1f} L {x + w:.1f} {y + h:.1f} Z' ) def svg_benchmark_weekly_usage(df: pd.DataFrame) -> str: """Bars of how many model releases reported this benchmark each week, spanning the whole dataset time range (empty weeks stay visible as gaps).""" t0 = MODELS_DF["release_date"].min().to_period("W") t1 = MODELS_DF["release_date"].max().to_period("W") weeks = pd.period_range(t0, t1, freq="W") counts = df["release_date"].dt.to_period("W").value_counts().reindex(weeks, fill_value=0) W, H, ML, MR, MT, MB = 920, 300, 44, 10, 12, 36 plot_h = H - MT - MB base = MT + plot_h vmax = int(counts.max()) step = max(1, math.ceil(vmax / 4)) ymax = step * 4 scale = plot_h / ymax band = (W - ML - MR) / len(weeks) bw = max(band - 1, 1.0) # 1px surface gap between adjacent bars (weekly bands are narrow) parts = [ f'' ] for k in range(5): v = step * k y = base - v * scale parts.append(f'') parts.append(f'{v}') week0_start = weeks[0].start_time for tick in month_ticks(week0_start, weeks[-1].end_time): idx = (tick - week0_start).days // 7 if 0 <= idx < len(weeks): cx = ML + idx * band + band / 2 parts.append( f'' f"{tick.strftime('%b %Y')}" ) for i, week in enumerate(weeks): n = int(counts.loc[week]) if n == 0: continue h = n * scale label = f"Week of {week.start_time.strftime('%b %-d, %Y')}: {n} model{'s' if n != 1 else ''}" parts.append( f'' f"{esc(label)}" ) parts.append(f'') parts.append("") return "".join(parts) def benchmark_view(benchmark): if not benchmark: return "", "", '
Pick a benchmark above.
' df = ( USAGE_DF[USAGE_DF["benchmark"] == benchmark] .drop_duplicates(subset=["model_id"]) .sort_values("release_date") ) n_open = int(df["is_open"].sum()) n_closed = len(df) - n_open summary = ( f'
{esc(benchmark)}
' f'
{len(df)} models from ' f"{df['lab'].nunique()} labs report it — " f"{n_open} open-weight, {n_closed} closed. First seen " f"{df['release_date'].min().date()}, most recent " f"{df['release_date'].max().date()}." f"
{benchmark_meta_block(benchmark)}
" ) chart = ( f'
How often is “{esc(benchmark)}” used? Model releases reporting it per week
' + svg_benchmark_weekly_usage(df) ) rows = [] for r in df.itertuples(): rows.append( "" f"{esc(r.model_id)}" f"{esc(r.lab)}" f'{r.release_date.date()}' f"{openness_chip(r.is_open)}" f'{esc(source_label(r.source))}' "" ) table = ( '
' '
' "" f'{"".join(rows)}
ModelLabReleasedOpennessSource
' ) return summary, chart, table # --------------------------------------------------------------------------- # Tab 4: Model -> Benchmarks (summary card + benchmarks grouped by category) # --------------------------------------------------------------------------- def model_view(model_id): if not model_id: return "", '
Pick a model above.
' df = ( USAGE_DF[USAGE_DF["model_id"] == model_id] .drop_duplicates(subset=["benchmark", "category"]) .sort_values(["category", "benchmark"]) ) if df.empty: return "", '
No data for this model.
' meta = MODELS_DF[MODELS_DF["model_id"] == model_id].iloc[0] src = df.iloc[0] summary = ( f'
{esc(model_id)} {openness_chip(bool(meta["is_open"]))}
' f'
{esc(meta["lab"])}, released ' f'{meta["release_date"].date()} · {df["benchmark"].nunique()} benchmarks ' f"across {df['category'].nunique()} categories · Source: " f'{esc(source_label(src["source"]))}
' ) sections = [] for category in CATEGORY_ORDER: sub = df[df["category"] == category] if sub.empty: continue chip_parts = [] for r in sub.itertuples(): info = BENCH_META.get(r.benchmark) if info: title = f"modality: {', '.join(info['modality'])} · language: {', '.join(info['language'])}" else: title = "no reference metadata catalogued yet" chip_parts.append( f'' f'{esc(r.benchmark)}' ) sections.append( f'
' f'{esc(category)} ({len(sub)})
{"".join(chip_parts)}
' ) return summary, "".join(sections) # --------------------------------------------------------------------------- # Tab 5: Category evolution (SVG stacked bars + table) # --------------------------------------------------------------------------- def svg_category_bars(counts: pd.DataFrame, normalize: bool) -> str: periods = counts.index.tolist() plot = counts.copy() if normalize: plot = plot.div(plot.sum(axis=1).replace(0, 1), axis=0) * 100 W, H, ML, MR, MT, MB, BW = 920, 430, 52, 10, 10, 36, 24 plot_h = H - MT - MB base = MT + plot_h ymax = 100.0 if normalize else float(nice_ceil(plot.sum(axis=1).max())) scale = plot_h / ymax band = (W - ML - MR) / max(len(periods), 1) parts = [ f'' ] for k in range(5): v = ymax * k / 4 y = base - v * scale parts.append(f'') lbl = f"{v:.0f}%" if normalize else f"{v:,.0f}" parts.append(f'{lbl}') for i, period in enumerate(periods): x0 = ML + i * band + band / 2 - BW / 2 row = plot.loc[period] nonzero = [c for c in plot.columns if row[c] > 0] cum = 0.0 for cat in nonzero: val = float(row[cat]) seg_bottom = base - cum * scale seg_top = base - (cum + val) * scale cum += val h = seg_bottom - seg_top disp = f"{val:.1f}%" if normalize else f"{val:,.0f} uses" title = f"{esc(period)} · {esc(cat)}: {disp}" fill = f"var(--cat-{esc(cat)})" is_top = cat == nonzero[-1] gy, gh = seg_top + 1, h - 2 # 2px surface gap between segments if gh < 1: gy, gh = seg_top, max(h, 0.8) if is_top and gh > 6: parts.append(f'{title}') else: parts.append(f'{title}') parts.append( f'{esc(period)}' ) parts.append(f'') parts.append("") return "".join(parts) def category_view(openness_filter, mode): df = USAGE_DF if openness_filter == "Open only": df = df[df["is_open"]] elif openness_filter == "Closed only": df = df[~df["is_open"]] normalize = mode == "Share of period (%)" df = df.drop_duplicates(subset=["model_id", "benchmark", "category"]) counts = df.groupby(["period", "category"]).size().unstack(fill_value=0) counts = counts.reindex(columns=[c for c in CATEGORY_ORDER if c in counts.columns], fill_value=0) counts = counts.reindex(PERIODS, fill_value=0) legend = '
' + "".join( f'{esc(c)}' for c in counts.columns ) + "
" title = "Benchmark category mix over time" + (" (% of period total)" if normalize else " (raw benchmark-use count)") chart = f'
{esc(title)}
' + legend + svg_category_bars(counts, normalize) rows = [] for period, row in counts.iterrows(): cells = "".join(f'{int(v)}' for v in row) rows.append(f"{esc(period)}{cells}") head = "Period" + "".join(f"{esc(c)}" for c in counts.columns) table = ( '
' f'{head}{"".join(rows)}
' ) return chart, table # --------------------------------------------------------------------------- # UI # --------------------------------------------------------------------------- DEFAULT_BENCH = "GPQA-Diamond" if "GPQA-Diamond" in ALL_BENCHMARKS else ALL_BENCHMARKS[0] with gr.Blocks(title="LLM Benchmark Usage Explorer") as demo: gr.HTML(render_hero()) with gr.Tab("🆕 Latest releases"): gr.HTML('

The most recent model releases, the benchmarks they report, and where the numbers come from.

') rel_count_pills = PillGroup(["10", "20", "50"], "10", "Show") rel_out = gr.HTML(latest_releases_view("10")) rel_count_pills.change(latest_releases_view, rel_count_pills, rel_out) with gr.Tab("📊 Popularity & timeline"): gr.HTML('

Which benchmarks are used the most, and when did they first show up?

') with gr.Row(): cat_pills = PillGroup(["All"] + ALL_CATEGORIES, "All", "Category", scale=3) open_pills = PillGroup(["All", "Open only", "Closed only"], "All", "Model type", scale=2) with gr.Row(): min_models_sl = RangeSlider(1, 20, 1, 1, "Min. # models using it") search_box = SearchBox("", "Search benchmark name", "e.g. GPQA") pop_out = gr.HTML(popularity_view("All", "All", 1, "")) for ctrl in [cat_pills, open_pills, min_models_sl, search_box]: ctrl.change(popularity_view, [cat_pills, open_pills, min_models_sl, search_box], pop_out) with gr.Tab("📚 All benchmarks"): gr.HTML('

Every benchmark referenced in the dataset — how many models report it, and where to find it.

') with gr.Row(): catalog_cat_pills = PillGroup(["All"] + ALL_CATEGORIES, "All", "Category", scale=3) catalog_sort_pills = PillGroup(["Most used", "Category", "Name (A-Z)"], "Most used", "Sort by", scale=2) catalog_search_box = SearchBox("", "Search benchmark name", "e.g. GPQA") catalog_out = gr.HTML(catalog_view("All", "Most used", "")) for ctrl in [catalog_cat_pills, catalog_sort_pills, catalog_search_box]: ctrl.change(catalog_view, [catalog_cat_pills, catalog_sort_pills, catalog_search_box], catalog_out) with gr.Tab("🔎 Benchmark → Models"): gr.HTML('

Pick a benchmark to see every model that reports it, and whether that model is open or closed.

') bench_sel = SelectBox(ALL_BENCHMARKS, DEFAULT_BENCH, "Benchmark") _s, _c, _t = benchmark_view(DEFAULT_BENCH) bench_summary = gr.HTML(_s) bench_chart = gr.HTML(_c) bench_table = gr.HTML(_t, js_on_load=TABLE_FILTER_JS) bench_sel.change(benchmark_view, bench_sel, [bench_summary, bench_chart, bench_table]) with gr.Tab("🧬 Model → Benchmarks"): gr.HTML('

Pick a model to see its full evaluation suite, grouped by category.

') model_sel = SelectBox(ALL_MODELS, ALL_MODELS[0], "Model") _s, _b = model_view(ALL_MODELS[0]) model_summary = gr.HTML(_s) model_body = gr.HTML(_b) model_sel.change(model_view, model_sel, [model_summary, model_body]) with gr.Tab("📈 Category evolution"): gr.HTML('

How has the type of benchmark being reported shifted over time?

') with gr.Row(): cat_open_pills = PillGroup(["All", "Open only", "Closed only"], "All", "Model type") norm_pills = PillGroup(["Share of period (%)", "Raw counts"], "Share of period (%)", "Y-axis") _c, _t = category_view("All", "Share of period (%)") cat_chart = gr.HTML(_c) cat_table = gr.HTML(_t) for ctrl in [cat_open_pills, norm_pills]: ctrl.change(category_view, [cat_open_pills, norm_pills], [cat_chart, cat_table]) if __name__ == "__main__": demo.launch(css=CUSTOM_CSS)