Hugging Face's logo

Spaces:
JBrightmanAI
/
Frontier-Benchmark
Running

App Files Community
JBrightmanAI commited on
Commit
1faaae1
·
verified ·
1 Parent(s): c485f14

Update index.html

Browse files
Files changed (1) hide show
  1. index.html +365 -19
index.html CHANGED
@@ -1,19 +1,365 @@
1
- <!doctype html>
2
- <html>
3
- <head>
4
- <meta charset="utf-8" />
5
- <meta name="viewport" content="width=device-width" />
6
- <title>My static Space</title>
7
- <link rel="stylesheet" href="style.css" />
8
- </head>
9
- <body>
10
- <div class="card">
11
- <h1>Welcome to your static Space!</h1>
12
- <p>You can modify this app directly by editing <i>index.html</i> in the Files and versions tab.</p>
13
- <p>
14
- Also don't forget to check the
15
- <a href="https://huggingface.co/docs/hub/spaces" target="_blank">Spaces documentation</a>.
16
- </p>
17
- </div>
18
- </body>
19
- </html>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <!DOCTYPE html>
2
+ <html lang="en">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>LLM Stats Benchmarks</title>
7
+ <script src="https://cdn.tailwindcss.com"></script>
8
+ <link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap" rel="stylesheet">
9
+ <style>
10
+ body { font-family: 'Inter', sans-serif; }
11
+ .card-hover { transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1); }
12
+ .card-hover:hover { transform: translateY(-4px); box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04); }
13
+ .score-bar { transition: width 1s ease-out; }
14
+ .fade-in { animation: fadeIn 0.5s ease-out; }
15
+ @keyframes fadeIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }
16
+ </style>
17
+ </head>
18
+ <body class="bg-gray-50 text-gray-900 min-h-screen flex flex-col">
19
+
20
+ <!-- Header -->
21
+ <header class="bg-white border-b border-gray-200 sticky top-0 z-50 shadow-sm">
22
+ <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-4">
23
+ <div class="flex flex-col md:flex-row md:items-center md:justify-between gap-4">
24
+ <div>
25
+ <h1 class="text-2xl font-bold text-gray-900 flex items-center gap-2">
26
+ <svg class="w-8 h-8 text-indigo-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
27
+ <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 19v-6a2 2 0 00-2-2H5a2 2 0 00-2 2v6a2 2 0 002 2h2a2 2 0 002-2zm0 0V9a2 2 0 012-2h2a2 2 0 012 2v10m-6 0a2 2 0 002 2h2a2 2 0 002-2m0 0V5a2 2 0 012-2h2a2 2 0 012 2v14a2 2 0 01-2 2h-2a2 2 0 01-2-2z"></path>
28
+ </svg>
29
+ LLM Stats Benchmarks
30
+ </h1>
31
+ <p class="text-sm text-gray-500 mt-1">Comprehensive leaderboard of AI model performance across diverse tasks</p>
32
+ </div>
33
+ <div class="flex flex-col sm:flex-row gap-3">
34
+ <input type="text" id="searchInput" placeholder="Search benchmarks..."
35
+ class="px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-indigo-500 focus:border-indigo-500 outline-none w-full sm:w-64 transition-shadow">
36
+ <select id="categoryFilter"
37
+ class="px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-indigo-500 focus:border-indigo-500 outline-none bg-white cursor-pointer">
38
+ <option value="all">All Categories</option>
39
+ </select>
40
+ </div>
41
+ </div>
42
+ </div>
43
+ </header>
44
+
45
+ <!-- Main Content -->
46
+ <main class="flex-grow max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-8 w-full">
47
+ <div id="benchmarkGrid" class="grid grid-cols-1 md:grid-cols-2 xl:grid-cols-3 gap-6">
48
+ <!-- Cards will be injected here -->
49
+ </div>
50
+ <div id="noResults" class="hidden text-center py-12 fade-in">
51
+ <svg class="w-16 h-16 text-gray-300 mx-auto mb-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
52
+ <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9.172 16.172a4 4 0 015.656 0M9 10h.01M15 10h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z"></path>
53
+ </svg>
54
+ <p class="text-gray-500 text-lg">No benchmarks found matching your criteria.</p>
55
+ </div>
56
+ </main>
57
+
58
+ <!-- Footer -->
59
+ <footer class="bg-white border-t border-gray-200 mt-auto">
60
+ <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-6 text-center text-sm text-gray-500">
61
+ Data sourced from <a href="https://llm-stats.com/benchmarks" class="text-indigo-600 hover:underline font-medium" target="_blank" rel="noopener">llm-stats.com/benchmarks</a>
62
+ <span class="mx-2">•</span>
63
+ Built for Hugging Face Spaces
64
+ </div>
65
+ </footer>
66
+
67
+ <script>
68
+ const benchmarks = [
69
+ {
70
+ name: "GPQA",
71
+ category: "physics",
72
+ description: "A challenging dataset of 448 multiple-choice questions written by domain experts in biology, physics, and chemistry. Questions are Google-proof and extremely difficult.",
73
+ topModels: [
74
+ { rank: 1, name: "GPT-5.6 Sol", score: 94.6 },
75
+ { rank: 2, name: "Claude Mythos Preview", score: 94.6 },
76
+ { rank: 3, name: "Gemini 3.1 Pro", score: 94.3 },
77
+ { rank: 4, name: "Claude Opus 4.7", score: 94.2 },
78
+ { rank: 5, name: "Claude Opus 4.8", score: 93.6 }
79
+ ]
80
+ },
81
+ {
82
+ name: "MMLU-Pro",
83
+ category: "language",
84
+ description: "A robust multi-task language understanding benchmark extending MMLU with 10 options, eliminating trivial questions, and focusing on reasoning-intensive tasks.",
85
+ topModels: [
86
+ { rank: 1, name: "Qwen3.7 Max", score: 89.6 },
87
+ { rank: 2, name: "Qwen3.7-Plus", score: 88.5 },
88
+ { rank: 3, name: "Qwen3.6 Plus", score: 88.5 },
89
+ { rank: 4, name: "MiniMax M2.1", score: 88.0 },
90
+ { rank: 5, name: "Qwen3.5-397B-A17B", score: 87.8 }
91
+ ]
92
+ },
93
+ {
94
+ name: "AIME 2025",
95
+ category: "math",
96
+ description: "All 30 problems from the 2025 American Invitational Mathematics Examination, testing olympiad-level mathematical reasoning with integer answers.",
97
+ topModels: [
98
+ { rank: 1, name: "GPT-5.2 Pro", score: 100.0 },
99
+ { rank: 2, name: "GPT-5.2", score: 100.0 },
100
+ { rank: 3, name: "Gemini 3 Pro", score: 100.0 },
101
+ { rank: 4, name: "Kimi K2-Thinking-0905", score: 100.0 },
102
+ { rank: 5, name: "Grok-4 Heavy", score: 100.0 }
103
+ ]
104
+ },
105
+ {
106
+ name: "SWE-Bench Verified",
107
+ category: "reasoning",
108
+ description: "A verified subset of 500 software engineering problems from real GitHub issues, evaluating language models' ability to resolve real-world coding issues.",
109
+ topModels: [
110
+ { rank: 1, name: "Claude Fable 5", score: 95.0 },
111
+ { rank: 2, name: "Claude Mythos Preview", score: 93.9 },
112
+ { rank: 3, name: "Claude Opus 4.8", score: 88.6 },
113
+ { rank: 4, name: "Claude Opus 4.7", score: 87.6 },
114
+ { rank: 5, name: "Claude Sonnet 5", score: 85.2 }
115
+ ]
116
+ },
117
+ {
118
+ name: "MMLU",
119
+ category: "language",
120
+ description: "Massive Multitask Language Understanding benchmark testing knowledge across 57 diverse subjects including STEM, humanities, and social sciences.",
121
+ topModels: [
122
+ { rank: 1, name: "GPT-5", score: 92.5 },
123
+ { rank: 2, name: "o1", score: 91.8 },
124
+ { rank: 3, name: "GPT-4.5", score: 90.8 },
125
+ { rank: 4, name: "o1-preview", score: 90.8 },
126
+ { rank: 5, name: "Sarvam-105B", score: 90.6 }
127
+ ]
128
+ },
129
+ {
130
+ name: "Humanity's Last Exam",
131
+ category: "math",
132
+ description: "A multi-modal academic benchmark with 2,500 questions across mathematics, humanities, and natural sciences, designed to test LLM capabilities at the frontier of human knowledge.",
133
+ topModels: [
134
+ { rank: 1, name: "Claude Mythos Preview", score: 64.7 },
135
+ { rank: 2, name: "Claude Fable 5", score: 64.5 },
136
+ { rank: 3, name: "Muse Spark 1.1", score: 62.1 },
137
+ { rank: 4, name: "Muse Spark", score: 58.4 },
138
+ { rank: 5, name: "Claude Opus 4.8", score: 57.9 }
139
+ ]
140
+ },
141
+ {
142
+ name: "LiveCodeBench",
143
+ category: "reasoning",
144
+ description: "A holistic and contamination-free evaluation benchmark for LLMs for code, continuously collecting new problems from programming contests (LeetCode, AtCoder, CodeForces).",
145
+ topModels: [
146
+ { rank: 1, name: "DeepSeek-V4-Pro-Max", score: 93.5 },
147
+ { rank: 2, name: "DeepSeek-V4-Flash-Max", score: 91.6 },
148
+ { rank: 3, name: "DeepSeek-V3.2", score: 83.3 },
149
+ { rank: 4, name: "DeepSeek-V3.2 (Thinking)", score: 83.3 },
150
+ { rank: 5, name: "MiniMax M2", score: 83.0 }
151
+ ]
152
+ },
153
+ {
154
+ name: "MATH",
155
+ category: "math",
156
+ description: "Contains 12,500 challenging competition mathematics problems from AMC 10, AMC 12, AIME, and other mathematics competitions with full step-by-step solutions.",
157
+ topModels: [
158
+ { rank: 1, name: "o3-mini", score: 97.9 },
159
+ { rank: 2, name: "o1", score: 96.4 },
160
+ { rank: 3, name: "MiniStral 3 (14B)", score: 90.4 },
161
+ { rank: 4, name: "Mistral Large 3", score: 90.4 },
162
+ { rank: 5, name: "Gemini 2.0 Flash", score: 89.7 }
163
+ ]
164
+ },
165
+ {
166
+ name: "HumanEval",
167
+ category: "reasoning",
168
+ description: "A benchmark that measures functional correctness for synthesizing programs from docstrings, consisting of 164 original programming problems.",
169
+ topModels: [
170
+ { rank: 1, name: "MiniCPM-SALA", score: 95.1 },
171
+ { rank: 2, name: "Kimi K2 0905", score: 94.5 },
172
+ { rank: 3, name: "Claude 3.5 Sonnet", score: 93.7 },
173
+ { rank: 4, name: "GPT-5", score: 93.4 },
174
+ { rank: 5, name: "Kimi K2 Instruct", score: 93.3 }
175
+ ]
176
+ },
177
+ {
178
+ name: "IFEval",
179
+ category: "instruction following",
180
+ description: "Instruction-Following Evaluation benchmark for large language models, focusing on verifiable instructions with 25 types of instructions and around 500 prompts.",
181
+ topModels: [
182
+ { rank: 1, name: "Qwen3.5-27B", score: 95.0 },
183
+ { rank: 2, name: "Qwen3.7-Plus", score: 94.6 },
184
+ { rank: 3, name: "Qwen3.7 Max", score: 94.3 },
185
+ { rank: 4, name: "Qwen3.6 Plus", score: 94.3 },
186
+ { rank: 5, name: "o3-mini", score: 93.9 }
187
+ ]
188
+ },
189
+ {
190
+ name: "MMMU-Pro",
191
+ category: "multimodal",
192
+ description: "A robust multi-discipline multimodal understanding benchmark that enhances MMMU through filtering text-only answerable questions and introducing vision-only input settings.",
193
+ topModels: [
194
+ { rank: 1, name: "Gemini 3.5 Flash", score: 83.6 },
195
+ { rank: 2, name: "GPT-5.5", score: 83.2 },
196
+ { rank: 3, name: "GPT-5.6 Sol", score: 83.0 },
197
+ { rank: 4, name: "Seed 2.1 Pro", score: 82.7 },
198
+ { rank: 5, name: "Seed 2.1 Turbo", score: 82.2 }
199
+ ]
200
+ },
201
+ {
202
+ name: "MMMU",
203
+ category: "multimodal",
204
+ description: "Massive Multi-discipline Multimodal Understanding benchmark designed to evaluate multimodal models on college-level subject knowledge and deliberate reasoning.",
205
+ topModels: [
206
+ { rank: 1, name: "Qwen3.6 Plus", score: 86.0 },
207
+ { rank: 2, name: "GPT-5.1", score: 85.4 },
208
+ { rank: 3, name: "GPT-5.1 Instant", score: 85.4 },
209
+ { rank: 4, name: "GPT-5.1 Thinking", score: 85.4 },
210
+ { rank: 5, name: "GPT-5", score: 84.2 }
211
+ ]
212
+ },
213
+ {
214
+ name: "BrowseComp",
215
+ category: "reasoning",
216
+ description: "A benchmark comprising 1,266 questions that challenge AI agents to persistently navigate the internet in search of hard-to-find, entangled information.",
217
+ topModels: [
218
+ { rank: 1, name: "Kimi K3", score: 91.2 },
219
+ { rank: 2, name: "GPT-5.6 Sol", score: 90.4 },
220
+ { rank: 3, name: "GPT-5.5 Pro", score: 90.1 },
221
+ { rank: 4, name: "GPT-5.6 Terra", score: 87.5 },
222
+ { rank: 5, name: "Claude Mythos Preview", score: 86.9 }
223
+ ]
224
+ },
225
+ {
226
+ name: "AIME 2024",
227
+ category: "math",
228
+ description: "American Invitational Mathematics Examination 2024, consisting of 30 challenging mathematical reasoning problems from AIME I and AIME II competitions.",
229
+ topModels: [
230
+ { rank: 1, name: "Grok-3 Mini", score: 95.8 },
231
+ { rank: 2, name: "o4-mini", score: 93.4 },
232
+ { rank: 3, name: "LongCat-Flash-Thinking", score: 93.3 },
233
+ { rank: 4, name: "Grok-3", score: 93.3 },
234
+ { rank: 5, name: "Gemini 2.5 Pro", score: 92.0 }
235
+ ]
236
+ },
237
+ {
238
+ name: "GSM8k",
239
+ category: "math",
240
+ description: "Grade School Math 8K, a dataset of 8.5K high-quality linguistically diverse grade school math word problems requiring multi-step reasoning.",
241
+ topModels: [
242
+ { rank: 1, name: "MiMo-V2.5-Pro", score: 99.6 },
243
+ { rank: 2, name: "Kimi K2 Instruct", score: 97.3 },
244
+ { rank: 3, name: "o1", score: 97.1 },
245
+ { rank: 4, name: "GPT-4.5", score: 97.0 },
246
+ { rank: 5, name: "Llama 3.1 405B Instruct", score: 96.8 }
247
+ ]
248
+ }
249
+ ];
250
+
251
+ const categoryColors = {
252
+ "math": "bg-blue-100 text-blue-800 border-blue-200",
253
+ "reasoning": "bg-purple-100 text-purple-800 border-purple-200",
254
+ "language": "bg-green-100 text-green-800 border-green-200",
255
+ "multimodal": "bg-pink-100 text-pink-800 border-pink-200",
256
+ "physics": "bg-indigo-100 text-indigo-800 border-indigo-200",
257
+ "instruction following": "bg-yellow-100 text-yellow-800 border-yellow-200",
258
+ "coding": "bg-red-100 text-red-800 border-red-200",
259
+ "long context": "bg-teal-100 text-teal-800 border-teal-200",
260
+ "legal": "bg-gray-100 text-gray-800 border-gray-200",
261
+ "spatial reasoning": "bg-orange-100 text-orange-800 border-orange-200",
262
+ "general": "bg-slate-100 text-slate-800 border-slate-200",
263
+ "image to text": "bg-cyan-100 text-cyan-800 border-cyan-200"
264
+ };
265
+
266
+ const categoryDisplay = {
267
+ "math": "Math",
268
+ "reasoning": "Reasoning",
269
+ "language": "Language",
270
+ "multimodal": "Multimodal",
271
+ "physics": "Physics",
272
+ "instruction following": "Instruction Following",
273
+ "coding": "Coding",
274
+ "long context": "Long Context",
275
+ "legal": "Legal",
276
+ "spatial reasoning": "Spatial Reasoning",
277
+ "general": "General",
278
+ "image to text": "Image to Text"
279
+ };
280
+
281
+ // Populate category filter
282
+ const categoryFilter = document.getElementById('categoryFilter');
283
+ const uniqueCategories = [...new Set(benchmarks.map(b => b.category))].sort();
284
+ uniqueCategories.forEach(cat => {
285
+ const option = document.createElement('option');
286
+ option.value = cat;
287
+ option.textContent = categoryDisplay[cat] || cat.charAt(0).toUpperCase() + cat.slice(1);
288
+ categoryFilter.appendChild(option);
289
+ });
290
+
291
+ function renderBenchmarks(data) {
292
+ const grid = document.getElementById('benchmarkGrid');
293
+ const noResults = document.getElementById('noResults');
294
+ grid.innerHTML = '';
295
+
296
+ if (data.length === 0) {
297
+ noResults.classList.remove('hidden');
298
+ return;
299
+ }
300
+ noResults.classList.add('hidden');
301
+
302
+ data.forEach(benchmark => {
303
+ const colorClass = categoryColors[benchmark.category] || "bg-gray-100 text-gray-800 border-gray-200";
304
+ const categoryName = categoryDisplay[benchmark.category] || benchmark.category.charAt(0).toUpperCase() + benchmark.category.slice(1);
305
+
306
+ const maxScore = Math.max(...benchmark.topModels.map(m => m.score));
307
+
308
+ const card = document.createElement('div');
309
+ card.className = 'bg-white rounded-xl border border-gray-200 p-6 card-hover fade-in flex flex-col';
310
+ card.innerHTML = `
311
+ <div class="flex items-start justify-between mb-3">
312
+ <span class="inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium border ${colorClass}">
313
+ ${categoryName}
314
+ </span>
315
+ </div>
316
+ <h3 class="text-xl font-bold text-gray-900 mb-2">${benchmark.name}</h3>
317
+ <p class="text-sm text-gray-600 mb-6 flex-grow leading-relaxed">${benchmark.description}</p>
318
+
319
+ <div class="space-y-3 mt-auto">
320
+ <h4 class="text-xs font-semibold text-gray-500 uppercase tracking-wider">Top Performers</h4>
321
+ ${benchmark.topModels.map((model, index) => `
322
+ <div class="flex items-center gap-3">
323
+ <span class="flex-shrink-0 w-5 h-5 flex items-center justify-center rounded-full text-xs font-bold ${index === 0 ? 'bg-yellow-100 text-yellow-700' : 'bg-gray-100 text-gray-600'}">
324
+ ${model.rank}
325
+ </span>
326
+ <div class="flex-grow min-w-0">
327
+ <div class="flex justify-between items-center mb-1">
328
+ <span class="text-sm font-medium text-gray-900 truncate">${model.name}</span>
329
+ <span class="text-sm font-bold text-indigo-600">${model.score}%</span>
330
+ </div>
331
+ <div class="w-full bg-gray-100 rounded-full h-1.5">
332
+ <div class="score-bar bg-indigo-500 h-1.5 rounded-full" style="width: ${(model.score / 100) * 100}%"></div>
333
+ </div>
334
+ </div>
335
+ </div>
336
+ `).join('')}
337
+ </div>
338
+ `;
339
+ grid.appendChild(card);
340
+ });
341
+ }
342
+
343
+ function filterBenchmarks() {
344
+ const searchTerm = document.getElementById('searchInput').value.toLowerCase();
345
+ const selectedCategory = document.getElementById('categoryFilter').value;
346
+
347
+ const filtered = benchmarks.filter(benchmark => {
348
+ const matchesSearch = benchmark.name.toLowerCase().includes(searchTerm) ||
349
+ benchmark.description.toLowerCase().includes(searchTerm) ||
350
+ benchmark.topModels.some(m => m.name.toLowerCase().includes(searchTerm));
351
+ const matchesCategory = selectedCategory === 'all' || benchmark.category === selectedCategory;
352
+ return matchesSearch && matchesCategory;
353
+ });
354
+
355
+ renderBenchmarks(filtered);
356
+ }
357
+
358
+ document.getElementById('searchInput').addEventListener('input', filterBenchmarks);
359
+ document.getElementById('categoryFilter').addEventListener('change', filterBenchmarks);
360
+
361
+ // Initial render
362
+ renderBenchmarks(benchmarks);
363
+ </script>
364
+ </body>
365
+ </html>