Spaces:
Running
Running
File size: 3,353 Bytes
13b1a91 a866fc9 13b1a91 a866fc9 13b1a91 a866fc9 13b1a91 | 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 | "use strict";
(function () {
const $ = (s) => document.querySelector(s);
function el(tag, cls, text) {
const n = document.createElement(tag);
if (cls) n.className = cls;
if (text != null) n.textContent = text;
return n;
}
const LABELS = {
sessions: "Visits", engaged_sessions: "Visits that opened a model", hardware_checks: "Hardware checks",
browser_benchmarks: "GPU tests", feedback: "Reports", mlx_benchmarks: "MLX benchmarks",
};
const CHARTS = [
["families", "Model families"], ["sizes", "Model sizes"], ["ram_classes", "Mac memory (GB)"],
["contexts", "Target context"], ["priorities", "What matters most"], ["selected_models", "Most compared or visited models"],
["gpu_capability", "Browser GPU class"], ["webgpu_available", "WebGPU available"],
];
const QCOLORS = { "2-bit": "#8a4f9e", "3-bit": "#7a5ab8", "4-bit": "#2f5d8c", "5-bit": "#3f7f86", "6-bit": "#2e7d4f", "8-bit": "#62802a" };
const fmtKey = (k) => (k === true ? "yes" : k === false ? "no" : typeof k === "number" && k >= 4096 ? `${Math.round(k / 1024)}k` : String(k));
function bars(items) {
const box = el("div", "bars");
if (!items.length) {
box.append(el("p", "scale-note", "Not enough data yet."));
return box;
}
const max = Math.max(...items.map((x) => x.count));
for (const it of items) {
const row = el("div", "bar");
const track = el("div", "track");
const fill = el("div", "fill");
fill.style.width = `${(it.count / max) * 100}%`;
track.append(fill);
const key = fmtKey(it.key);
const k = el("span", "k", key);
k.title = key;
row.append(k, track, el("span", "n", `${it.count.toLocaleString()} (${Math.round(it.share * 100)}%)`));
box.append(row);
}
return box;
}
async function load() {
let s;
try {
const r = await fetch("/api/stats");
if (!r.ok) throw new Error(String(r.status));
s = await r.json();
} catch (e) {
$("#updated").textContent = "Statistics couldn't be loaded. Refresh in a moment.";
return;
}
$("#kmin").textContent = s.k_min;
$("#totals").replaceChildren(...Object.entries(s.totals).map(([k, v]) => {
const d = el("div", "total");
d.append(el("b", null, v.toLocaleString()), el("span", null, LABELS[k] || k));
return d;
}));
const q = Object.entries(s.quant_share).filter(([, v]) => v);
const qs = $("#qshare");
qs.replaceChildren(...q.map(([k, v]) => {
const seg = el("span", null, v >= 0.08 ? `${k} ${Math.round(v * 100)}%` : "");
seg.style.width = `${v * 100}%`;
seg.style.background = QCOLORS[k] || "#7b8895";
seg.title = `${k}: ${Math.round(v * 100)}%`;
return seg;
}));
$("#qshare-note").textContent = q.length ? q.map(([k, v]) => `${k} ${Math.round(v * 100)}%`).join(", ") : "Not enough visits with a quantization filter yet.";
$("#avgctx").textContent = s.average_target_context ? `Average target context: ${Math.round(s.average_target_context / 1024)}k tokens.` : "";
$("#charts").replaceChildren(...CHARTS.map(([key, title]) => {
const c = el("section", "chart");
c.append(el("h2", null, title), bars(s[key] || []));
return c;
}));
$("#updated").textContent = `Updated ${new Date().toLocaleString()}.`;
}
load();
})();
|