force model cache (#751)

candle-wasm-examples/llama2-c/lib-example.html

@@ -38,11 +38,11 @@
         },
         stories42M: {
           url: "stories42M.bin",
-          seq_len: 256,
+          seq_len: 1024,
         },
         stories110M: {
           url: "stories110M.bin",
-          seq_len: 256,
+          seq_len: 1024,
         },
       };
 
@@ -124,9 +124,17 @@
       const prompt = document.querySelector("#prompt");
       const clearBtn = document.querySelector("#clear-btn");
       const runBtn = document.querySelector("#run");
+      const modelSelect = document.querySelector("#model");
       let runController = new AbortController();
       let isRunning = false;
 
+      modelSelect.addEventListener("change", (e) => {
+        const model = MODELS[e.target.value];
+        document.querySelector("#max-seq").max = model.seq_len;
+        document.querySelector("#max-seq").nextElementSibling.value =
+          model.seq_len;
+      });
+
       form.addEventListener("submit", async (e) => {
         e.preventDefault();
         if (isRunning) {

candle-wasm-examples/llama2-c/llama2cWorker.js

@@ -1,13 +1,17 @@
 import init, { Model } from "./build/m.js";
 
 async function fetchArrayBuffer(url) {
-  const res = await fetch(url, {
+  const cacheName = "llama2c-candle-cache";
-    cache: "force-cache",
+  const cache = await caches.open(cacheName);
-  });
+  const cachedResponse = await cache.match(url);
-  const data = await res.arrayBuffer();
+  if (cachedResponse) {
+    const data = await cachedResponse.arrayBuffer();
     return new Uint8Array(data);
+  }
+  const res = await fetch(url, { cache: "force-cache" });
+  cache.put(url, res.clone());
+  return new Uint8Array(await res.arrayBuffer());
 }
-
 class Llama2C {
   static instance = {};
 

candle-wasm-examples/whisper/whisperWorker.js

@@ -2,16 +2,17 @@
 import init, { Decoder } from "./build/m.js";
 
 async function fetchArrayBuffer(url) {
-  const res = await fetch(url, {
+  const cacheName = "whisper-candle-cache";
-    cache: "force-cache",
+  const cache = await caches.open(cacheName);
-    headers: {
+  const cachedResponse = await cache.match(url);
-      "Cache-Control": "public, max-age=31536000",
+  if (cachedResponse) {
-    },
+    const data = await cachedResponse.arrayBuffer();
-  });
-  const data = await res.arrayBuffer();
     return new Uint8Array(data);
+  }
+  const res = await fetch(url, { cache: "force-cache" });
+  cache.put(url, res.clone());
+  return new Uint8Array(await res.arrayBuffer());
 }
-
 class Whisper {
   static instance = {};
   // Retrieve the Whisper model. When called for the first time,

candle-wasm-examples/yolo/yoloWorker.js

@@ -1,6 +1,19 @@
 //load the candle yolo wasm module
 import init, { Model, ModelPose } from "./build/m.js";
 
+async function fetchArrayBuffer(url) {
+  const cacheName = "yolo-candle-cache";
+  const cache = await caches.open(cacheName);
+  const cachedResponse = await cache.match(url);
+  if (cachedResponse) {
+    const data = await cachedResponse.arrayBuffer();
+    return new Uint8Array(data);
+  }
+  const res = await fetch(url, { cache: "force-cache" });
+  cache.put(url, res.clone());
+  return new Uint8Array(await res.arrayBuffer());
+}
+
 class Yolo {
   static instance = {};
   // Retrieve the YOLO model. When called for the first time,
@@ -11,9 +24,7 @@ class Yolo {
       await init();
 
       self.postMessage({ status: `loading model ${modelID}:${modelSize}` });
-      const modelRes = await fetch(modelURL);
+      const weightsArrayU8 = await fetchArrayBuffer(modelURL);
-      const yoloArrayBuffer = await modelRes.arrayBuffer();
-      const weightsArrayU8 = new Uint8Array(yoloArrayBuffer);
       if (/pose/.test(modelID)) {
         // if pose model, use ModelPose
         this.instance[modelID] = new ModelPose(weightsArrayU8, modelSize);