File size: 4,966 Bytes
f8d016c
 
 
 
 
 
 
 
 
 
 
ac23d5d
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
f8d016c
 
 
 
ac23d5d
 
f8d016c
 
 
 
 
 
 
ac23d5d
f8d016c
 
 
 
 
 
 
 
 
 
 
 
 
 
 
ac23d5d
 
 
 
f8d016c
 
 
 
ac23d5d
 
f8d016c
 
 
 
 
ac23d5d
f8d016c
 
 
 
 
 
 
ac23d5d
 
 
f8d016c
 
 
 
 
ac23d5d
 
f8d016c
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
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
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
import { runWebBenchmarkCold, runWebBenchmarkWarm } from "./benchmark.js";

const btn = document.getElementById("run") as HTMLButtonElement;
const out = document.getElementById("out") as HTMLPreElement;
const statusEl = document.getElementById("status") as HTMLSpanElement;
const modelEl = document.getElementById("model") as HTMLInputElement;
const taskEl = document.getElementById("task") as HTMLSelectElement;
const modeEl = document.getElementById("mode") as HTMLSelectElement;
const repeatsEl = document.getElementById("repeats") as HTMLInputElement;
const deviceEl = document.getElementById("device") as HTMLSelectElement;

// URL parameter utilities
function getUrlParams(): URLSearchParams {
  return new URLSearchParams(window.location.search);
}

function setUrlParams(params: Record<string, string>) {
  const url = new URL(window.location.href);
  Object.entries(params).forEach(([key, value]) => {
    url.searchParams.set(key, value);
  });
  window.history.replaceState({}, '', url);
}

function loadParamsFromUrl() {
  const params = getUrlParams();
  if (params.has('model')) modelEl.value = params.get('model')!;
  if (params.has('task')) taskEl.value = params.get('task')!;
  if (params.has('mode')) modeEl.value = params.get('mode')!;
  if (params.has('repeats')) repeatsEl.value = params.get('repeats')!;
  if (params.has('device')) deviceEl.value = params.get('device')!;
}

function saveParamsToUrl(modelId: string, task: string, mode: string, repeats: number, device: string, dtype?: string, batchSize?: number) {
  const params: Record<string, string> = {
    model: modelId,
    task,
    mode,
    repeats: String(repeats),
    device,
  };
  if (dtype) params.dtype = dtype;
  if (batchSize && batchSize !== 1) params['batch-size'] = String(batchSize);
  setUrlParams(params);
}

async function runWarmWithReload(modelId: string, task: string, repeats: number, device: string, dtype?: string, batchSize: number = 1) {
  const flag = sessionStorage.getItem("__warm_ready__");
  if (!flag) {
    statusEl.textContent = "prefetching (warmup) ...";
    // Save params to URL for reproducibility
    saveParamsToUrl(modelId, task, 'warm', repeats, device, dtype, batchSize);
    // Perform warmup and store flag
    const { pipeline } = await import("@huggingface/transformers");
    const options: any = { device };
    if (dtype) options.dtype = dtype;
    const p = await pipeline(task, modelId, options);
    const warmupInputs = Array(batchSize).fill("warmup");
    await p(warmupInputs);
    sessionStorage.setItem("__warm_ready__", "1");
    location.reload();
    return null;
  } else {
    sessionStorage.removeItem("__warm_ready__");
    statusEl.textContent = "running (warm)...";
    return await runWebBenchmarkWarm(modelId, task, repeats, device, dtype, batchSize);
  }
}

async function run() {
  const modelId = modelEl.value.trim() || "Xenova/distilbert-base-uncased";
  const task = taskEl.value;
  const mode = modeEl.value as "warm" | "cold";
  const repeats = Math.max(1, parseInt(repeatsEl.value || "3", 10));
  const device = deviceEl.value;
  const params = getUrlParams();
  const dtype = params.get('dtype') || undefined;
  const batchSize = params.has('batch-size') ? parseInt(params.get('batch-size')!, 10) : 1;

  out.textContent = "{}";

  if (mode === "cold") {
    statusEl.textContent = "clearing caches (cold)...";
    saveParamsToUrl(modelId, task, 'cold', repeats, device, dtype, batchSize);
    const r = await runWebBenchmarkCold(modelId, task, repeats, device, dtype, batchSize);
    if (r) {
      out.textContent = JSON.stringify(r, null, 2);
      statusEl.textContent = "done (cold)";
    }
  } else {
    const r = await runWarmWithReload(modelId, task, repeats, device, dtype, batchSize);
    if (r) {
      out.textContent = JSON.stringify(r, null, 2);
      statusEl.textContent = "done (warm)";
    }
  }
}

// Load parameters from URL on page load
loadParamsFromUrl();

// Auto-run if returning from warm reload
(async () => {
  const flag = sessionStorage.getItem("__warm_ready__");
  if (flag) {
    try {
      // Parameters are already in URL, just load them to form
      loadParamsFromUrl();
      await run();
    } catch (e) {
      console.error(e);
    }
  }
})();

btn.addEventListener("click", () => {
  run().catch((e) => {
    out.textContent = String(e);
    statusEl.textContent = "error";
    console.error(e);
  });
});

// Expose for CLI use
(window as any).runBenchmarkCLI = async function (params: {
  modelId: string;
  task: string;
  mode: string;
  repeats: number;
  device: string;
  dtype?: string;
  batchSize?: number;
}) {
  const batchSize = params.batchSize || 1;
  if (params.mode === "cold") {
    return await runWebBenchmarkCold(params.modelId, params.task, params.repeats, params.device, params.dtype, batchSize);
  } else {
    return await runWebBenchmarkWarm(params.modelId, params.task, params.repeats, params.device, params.dtype, batchSize);
  }
};