next-blurhash-previews 0.0.3-beta69 → 0.0.3-beta71

package/components/ImageWithPreview.tsx

@@ -76,7 +76,6 @@ const workerBlob = new Blob(
   [document.querySelector("#next-blurhash-worker-script")!.textContent!],
   { type: "text/javascript" }
 );
-const worker = new Worker(window.URL.createObjectURL(workerBlob));
 
 function updateBlurHashPreview(canvasEl: HTMLCanvasElement, preview: blurhash) {
   const { w: width, h: height, blurhash } = preview;
@@ -84,6 +83,27 @@ function updateBlurHashPreview(canvasEl: HTMLCanvasElement, preview: blurhash) {
   canvasEl.height = height;
 
   if (true) {
+    const worker = new Worker(window.URL.createObjectURL(workerBlob));
+
+    const s = +new Date();
+
+    const emptyCanv = document
+      .createElement("canvas")
+      // @ts-ignore
+      .transferControlToOffscreen();
+
+    worker.postMessage(
+      {
+        canvas: emptyCanv,
+        width: 50,
+        height: 50,
+        blurhash: "L05E$[offQofoffQfQfQfQfQfQfQ",
+      },
+      [emptyCanv]
+    );
+    const e = +new Date();
+    console.log("bootstrap", e - s);
+
     const offscreen = (canvasEl as any).transferControlToOffscreen();
     worker.postMessage({ canvas: offscreen, width, height, blurhash }, [
       offscreen,

package/imagePreviewBootstrap.js

@@ -279,7 +279,6 @@ if (!customElements.get("blurhash-image")) {
 const workerBlob = new Blob([document.querySelector("#next-blurhash-worker-script").textContent], {
   type: "text/javascript"
 });
-const worker = new Worker(window.URL.createObjectURL(workerBlob));
 function updateBlurHashPreview(canvasEl, preview) {
   const {
     w: width,
@@ -289,6 +288,17 @@ function updateBlurHashPreview(canvasEl, preview) {
   canvasEl.width = width;
   canvasEl.height = height;
   {
+    const worker = new Worker(window.URL.createObjectURL(workerBlob));
+    const s = +new Date();
+    const emptyCanv = document.createElement("canvas").transferControlToOffscreen();
+    worker.postMessage({
+      canvas: emptyCanv,
+      width: 50,
+      height: 50,
+      blurhash: "L05E$[offQofoffQfQfQfQfQfQfQ"
+    }, [emptyCanv]);
+    const e = +new Date();
+    console.log("bootstrap", e - s);
     const offscreen = canvasEl.transferControlToOffscreen();
     worker.postMessage({
       canvas: offscreen,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "next-blurhash-previews",
-  "version": "0.0.3-beta69",
+  "version": "0.0.3-beta71",
   "description": "",
   "main": "index.js",
   "module": "index.js",