Update chart and table styling

app.js

@@ -351,6 +351,10 @@ function buildChart(filtered) {
     const gRows = filtered.filter(r => String(r[GROUP_BY]) === String(groupVal));
     if (!gRows.length) return;
 
+    // Don't show chart when there is only a single model
+    const uniqueModels = new Set(gRows.map(r => r[MODEL_COL]));
+    if (uniqueModels.size <= 1) return;
+
     // If no scenarios configured, show one chart with all rows
     const scenarioList = scenarios.length
         ? scenarios
@@ -464,7 +468,7 @@ function buildTables(filtered, chartsShown) {
 
     // Build column list: Model + visible display cols + metrics
     const colDefs = [
-        { key: MODEL_COL, label: "Model", isModel: true },
+        { key: MODEL_COL, label: "MODEL", isModel: true },
         ...visibleDisplay.map(dc => ({ key: dc.column, label: dc.label, description: dc.description || "" })),
         ...config.metrics.map(m => ({ key: m.column, label: m.short || m.column, isMetric: true, description: m.description || "" })),
     ];
@@ -519,7 +523,7 @@ function buildTables(filtered, chartsShown) {
         const firstMetricIdx = colDefs.findIndex(c => c.isMetric);
         html += colDefs.map((c, i) => {
             const tip = c.description ? ` data-tip="${c.description.replace(/"/g, '&quot;')}"` : '';
-            const cls = i === firstMetricIdx ? ' class="first-metric"' : '';
+            const cls = i === firstMetricIdx ? ' class="first-metric metric-cell"' : (c.isMetric ? ' class="metric-cell"' : '');
             return `<th${tip}${cls}>${c.label}</th>`;
         }).join("");
         html += `</tr></thead><tbody>`;
@@ -557,13 +561,13 @@ function buildTables(filtered, chartsShown) {
             html += `<tr class="${rowClass}">`;
             colDefs.forEach((c, i) => {
                 const val = r[c.key];
-                const fmCls = i === firstMetricIdx ? ' class="first-metric"' : '';
+                const fmCls = i === firstMetricIdx ? ' class="first-metric metric-cell"' : ' class="metric-cell"';
                 if (c.isModel) {
                     const hfUrl = LINK_PREFIX + val;
                     const modelColor = MODEL_COLORS[val]?.border || '#888';
                     html += `<td class="model-cell"><span class="model-dot" style="background:${modelColor}"></span><a href="${hfUrl}" target="_blank" rel="noopener" style="color:${modelColor}">${val}</a></td>`;
                 } else if (oom) {
-                    html += `<td${fmCls}><span class="oom">OOM</span></td>`;
+                    html += `<td${c.isMetric ? fmCls : ''}><span class="oom">OOM</span></td>`;
                 } else if (c.isMetric) {
                     const sg = groupRowKey(r);
                     const isBest = val !== null && val !== undefined && val === bestByGroup[sg]?.[c.key];
@@ -629,7 +633,7 @@ function render() {
     });
 
     buildChart(filtered);
-    const chartsShown = filters[GROUP_BY] !== "all";
+    const chartsShown = charts.length > 0;
     // Toggle metric selector visibility
     const metricEl = document.getElementById("filter-metric");
     if (metricEl) {

config.json

@@ -37,21 +37,21 @@
     {
       "column": "tpot",
       "label": "Time per Output Token (ms)",
-      "short": "TPOT ↓",
+      "short": "TPOT(ms) ↓",
       "higher_is_better": false,
       "description": "Time per output token in ms (lower is better). Average time (in milliseconds) required to generate one output token during decoding. Computed as TPOT = (last_token_ts - first_token_ts) / total_output_tokens."
     },
     {
       "column": "ttft",
       "label": "Time to First Token (ms)",
-      "short": "TTFT ↓",
+      "short": "TTFT(ms) ↓",
       "higher_is_better": false,
       "description": "Time to first token in ms (lower is better). Time from request submission to generation of the first output token. This includes vision encoding, prompt prefill, KV cache initialization."
     },
     {
       "column": "e2e",
       "label": "End-to-End Latency (sec)",
-      "short": "E2E ↓",
+      "short": "E2E(s) ↓",
       "higher_is_better": false,
       "description": "End-to-end latency in seconds (lower is better). Total time from request submission to completion of the full generated response. This reflects real user-perceived latency."
     }
@@ -59,7 +59,7 @@
   "display_columns": [
     {
       "column": "res",
-      "label": "Resolution",
+      "label": "RESOLUTION",
       "visible_when": {
         "type": [
           "video",
@@ -128,12 +128,12 @@
   "table_group_by": "model",
   "model_families": {
     "Cosmos-Reason2-2B": {
-      "data_file": "data/cosmos-reason2.csv",
+      "data_file": "data/Cosmos-Reason2.csv",
       "table_group_by": ["res", "fps"],
       "experiment_setup": {
         "agx_thor": "Measurement setup: NVIDIA vLLM 26.01, 256 tokens generated, 10 warm-up runs, averaged over 25 runs.",
-        "agx_orin": "Measurement setup: NVIDIA vLLM 0.14.0 for Jetson, 256 tokens generated, 10 warm-up runs, averaged over 25 runs.",
-        "orin_nano": "Measurement setup: NVIDIA vLLM 0.14.0 for Jetson, 256 tokens generated, 10 warm-up runs, averaged over 25 runs."
+        "agx_orin": "Measurement setup: NVIDIA AI IoT vLLM 0.14.0 tegra, 256 tokens generated, 10 warm-up runs, averaged over 25 runs.",
+        "orin_nano": "Measurement setup: NVIDIA AI IoT vLLM 0.14.0 tegra, 256 tokens generated, 10 warm-up runs, averaged over 25 runs."
       }
     }
   }

style.css

@@ -183,7 +183,6 @@ code {
     display: block;
     font-size: 0.8rem;
     font-weight: 600;
-    text-transform: uppercase;
     letter-spacing: 0.08em;
     color: var(--text-dim);
     margin-bottom: 0.25rem;
@@ -300,7 +299,6 @@ thead th {
     text-align: left;
     font-weight: 600;
     font-size: 0.8rem;
-    text-transform: uppercase;
     letter-spacing: 0.05em;
     color: var(--text-dim);
     padding: 0.5rem 0.75rem;
@@ -315,6 +313,11 @@ tbody td {
     color: var(--text-muted);
 }
 
+th.metric-cell,
+td.metric-cell {
+    text-align: right;
+}
+
 tbody tr:last-child td {
     border-bottom: 1px solid var(--border);
 }