-
Notifications
You must be signed in to change notification settings - Fork 10
/
onnx-text-demo.html
51 lines (44 loc) · 2.17 KB
/
onnx-text-demo.html
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
<!DOCTYPE html>
<html>
<head>
<title>OpenAI CLIP JavaScript - Text Demo - ONNX Web Runtime</title>
<script src="enable-threads.js"></script>
</head>
<body>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/ort.js"></script>
<div>
input text <input id="textInputEl" value="This is a portrait of an astronaut with the American flag">
<br>
quantized: <select id="quantizedSelectEl">
<option value="no">no</option>
<option value="yes">yes (4x smaller model, but currently the embeddings are inaccurate - see readme)</option>
</select>
<br>
<button id="startBtn" onclick="main()">start</button>
</div>
<p><a href="https://github.com/josephrocca/openai-clip-js">github repo</a></p>
<script>
if(self.crossOriginIsolated) { // needs to be cross-origin-isolated to use wasm threads. you need to add these two headers: https://web.dev/coop-coep/
ort.env.wasm.numThreads = navigator.hardwareConcurrency
}
async function main() {
startBtn.disabled = true;
startBtn.innerHTML = "see console";
console.log("Loading model... (see network tab for progress)");
let modelPath = quantizedSelectEl.value === "no" ? 'https://huggingface.co/rocca/openai-clip-js/resolve/main/clip-text-vit-32-float32-int32.onnx' : 'https://huggingface.co/rocca/openai-clip-js/resolve/main/clip-text-vit-32-uint8.onnx';
const session = await ort.InferenceSession.create(modelPath, { executionProviders: ["wasm"] });
console.log("Model loaded.");
let Tokenizer = (await import("https://deno.land/x/[email protected]/mod.js")).default;
let t = new Tokenizer();
let textTokens = t.encodeForCLIP(textInputEl.value);
textTokens = Int32Array.from(textTokens);
const feeds = {'input': new ort.Tensor('int32', textTokens, [1, 77])};
console.log("Running inference...");
const results = await session.run(feeds);
console.log("Finished inference.");
const data = results["output"].data;
console.log(`data of result tensor 'output'`, data);
}
</script>
</body>
</html>