wasm-html-to-image 0.1.0

package/dist/workers.js

@@ -0,0 +1,163 @@
+import { loadWorkerLib } from "./worker-lib-loader.js";
+// Playground parity: diagnostics surface is usable through the pool —
+// function-valued options (`onLog`/`onDiagnostics`/`resolveResource`) are
+// forwarded untouched by the `render` proxy below (worker-lib RPC).
+export { DEFAULT_FONT_MAP, DIAGNOSTIC_CODES, LogLevel } from "./core.js";
+// worker-lib's published ESM is broken under plain Node (see
+// worker-lib-loader.ts); top-level await keeps call sites sync-shaped.
+const { createWorker, Worker } = await loadWorkerLib();
+/**
+ * Create a wasm-html-to-image worker pool using worker-lib.
+ * The pooled action is the unified `render` (HTML and image inputs).
+ * Each worker thread loads its own module instance via the loader
+ * (modules cannot cross thread boundaries).
+ *
+ * @param params Initialization parameters
+ * @param params.worker Optional: Path to the worker file, a URL, or a factory function.
+ *                      Defaults to the pre-bundled browser worker
+ *                      (`./web-workers.js`, SINGLE_FILE inlined) when
+ *                      `window` exists, else the Node worker
+ *                      (`./child-workers.js`) next to this file.
+ * @param params.maxParallel Maximum number of parallel workers (default: 4)
+ * @param params.timeoutMs Optional: Default timeout in milliseconds for each render job.
+ *                         If a render job times out, the pool is reset to prevent hung workers.
+ */
+export const createHtmlToImageWorker = (params) => {
+    const { worker, maxParallel = 4, timeoutMs } = params ?? {};
+    const factory = () => {
+        let w;
+        if (worker) {
+            w = typeof worker === "function" ? worker() : worker;
+        }
+        else {
+            // child-workers.js = Node worker; web-workers.js = pre-bundled
+            // browser worker (SINGLE_FILE inlined, no .wasm fetch needed).
+            const workerUrl = typeof window !== "undefined"
+                ? new URL("./web-workers.js", import.meta.url)
+                : new URL("./child-workers.js", import.meta.url);
+            if (typeof Worker !== "undefined") {
+                w = new Worker(workerUrl, { type: "module" });
+            }
+        }
+        if (!w)
+            throw new Error("Worker is not supported in this environment.");
+        return w;
+    };
+    const workerInstance = createWorker(factory, maxParallel);
+    let totalPendingJobs = 0;
+    let completedJobs = 0;
+    let failedJobs = 0;
+    let totalJobTimeMs = 0;
+    /**
+     * Retrieve operational stats of the worker pool.
+     */
+    const getStats = () => ({
+        workerCount: maxParallel,
+        activeJobs: Math.min(totalPendingJobs, maxParallel),
+        queuedJobs: Math.max(0, totalPendingJobs - maxParallel),
+        completedJobs,
+        failedJobs,
+        avgJobTimeMs: completedJobs > 0 ? totalJobTimeMs / completedJobs : 0,
+    });
+    /**
+     * Reset the worker pool by terminating all running workers and recreating them.
+     * Useful to clear hung workers or reset statistics.
+     */
+    const reset = () => {
+        workerInstance.setLimit(0);
+        workerInstance.setLimit(maxParallel);
+        totalPendingJobs = 0;
+        completedJobs = 0;
+        failedJobs = 0;
+        totalJobTimeMs = 0;
+    };
+    const proxy = new Proxy(workerInstance, {
+        get(target, prop, receiver) {
+            if (prop === "getStats") {
+                return getStats;
+            }
+            if (prop === "reset") {
+                return reset;
+            }
+            if (prop === "render") {
+                return async (options) => {
+                    totalPendingJobs++;
+                    const startTime = Date.now();
+                    let timeoutId;
+                    let timeoutPromise;
+                    if (timeoutMs !== undefined && timeoutMs > 0) {
+                        timeoutPromise = new Promise((_, reject) => {
+                            timeoutId = setTimeout(() => {
+                                // If a job times out, terminate and recreate workers to recover from a potential hang
+                                reset();
+                                reject(new Error(`Render timed out after ${timeoutMs}ms`));
+                            }, timeoutMs);
+                        });
+                    }
+                    // Protect caller's buffer from being detached if worker-lib transfers TypedArrays
+                    let execOptions = options;
+                    if (options && typeof options === "object") {
+                        if (options.value instanceof Uint8Array) {
+                            execOptions = { ...options, value: options.value.slice() };
+                        }
+                        else if (options.value instanceof ArrayBuffer) {
+                            execOptions = { ...options, value: options.value.slice(0) };
+                        }
+                    }
+                    try {
+                        const executePromise = target.execute("render", execOptions);
+                        const result = await (timeoutPromise
+                            ? Promise.race([executePromise, timeoutPromise])
+                            : executePromise);
+                        completedJobs++;
+                        totalJobTimeMs += Date.now() - startTime;
+                        return result;
+                    }
+                    catch (e) {
+                        failedJobs++;
+                        throw e;
+                    }
+                    finally {
+                        if (timeoutId) {
+                            clearTimeout(timeoutId);
+                        }
+                        totalPendingJobs--;
+                    }
+                };
+            }
+            if (prop in target) {
+                return Reflect.get(target, prop, receiver);
+            }
+            // No generic `execute` forwarding: only the explicit pool API above
+            // (render/getStats/reset) plus worker-lib's own methods (close,
+            // launchWorker, setLimit, waitAll, waitReady) are available.
+            // Returning undefined (instead of throwing) keeps `await pool` working.
+            return undefined;
+        },
+    });
+    return proxy;
+};
+let defaultWorker;
+/** Lazily create the shared single-slot pool on first use (not at import). */
+function getDefaultWorker() {
+    if (!defaultWorker) {
+        defaultWorker = createHtmlToImageWorker({ maxParallel: 1 });
+    }
+    return defaultWorker;
+}
+export const close = () => {
+    getDefaultWorker().close();
+};
+export function render(options) {
+    return getDefaultWorker().render(options);
+}
+export const launchWorker = () => getDefaultWorker().launchWorker();
+export const setLimit = (limit) => {
+    getDefaultWorker().setLimit(limit);
+};
+export const waitAll = () => getDefaultWorker().waitAll();
+export const waitReady = (retryTime) => getDefaultWorker().waitReady(retryTime);
+export const reset = () => {
+    getDefaultWorker().reset();
+};
+export const getStats = () => getDefaultWorker().getStats();

package/package.json

@@ -0,0 +1,166 @@
+{
+  "name": "wasm-html-to-image",
+  "version": "0.1.0",
+  "description": "HTML to image converter on a single unified WASM module",
+  "type": "module",
+  "main": "./dist/single.js",
+  "types": "./dist/single.d.ts",
+  "bin": {
+    "wasm-html-to-image": "./dist/cli.js"
+  },
+  "author": "SoraKumo <info@croud.jp>",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/SoraKumo001/wasm-html-to-image.git",
+    "directory": "packages/html-to-image"
+  },
+  "homepage": "https://sorakumo001.github.io/wasm-html-to-image/",
+  "bugs": {
+    "url": "https://github.com/SoraKumo001/wasm-html-to-image/issues"
+  },
+  "keywords": [
+    "wasm",
+    "webassembly",
+    "html-to-image",
+    "html2image",
+    "skia",
+    "litehtml",
+    "image-optimization",
+    "screenshot",
+    "ogp",
+    "avif",
+    "webp",
+    "pdf",
+    "thumbhash",
+    "cloudflare-workers",
+    "edge-runtime"
+  ],
+  "engines": {
+    "node": ">=20.0.0"
+  },
+  "scripts": {
+    "build": "tsc -b && node scripts/compress-wasm.mjs && rolldown -c rolldown.config.js",
+    "prepublishOnly": "npm run build",
+    "test": "vitest run",
+    "example:cli": "tsx src/cli.ts --help"
+  },
+  "exports": {
+    ".": {
+      "workerd": {
+        "types": "./dist/workerd.d.ts",
+        "import": "./dist/workerd.js"
+      },
+      "deno": {
+        "types": "./dist/single.d.ts",
+        "import": "./dist/single.js"
+      },
+      "single": {
+        "types": "./dist/single.d.ts",
+        "import": "./dist/single.js"
+      },
+      "types": "./dist/single.d.ts",
+      "import": "./dist/single.js",
+      "default": "./dist/single.js"
+    },
+    "./index": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js",
+      "default": "./dist/index.js"
+    },
+    "./single": {
+      "types": "./dist/single.d.ts",
+      "import": "./dist/single.js",
+      "default": "./dist/single.js"
+    },
+    "./workerd": {
+      "workerd": {
+        "types": "./dist/workerd.d.ts",
+        "import": "./dist/workerd.js",
+        "default": "./dist/workerd.js"
+      },
+      "edge-light": {
+        "types": "./dist/edge-light.d.ts",
+        "import": "./dist/edge-light.js",
+        "default": "./dist/edge-light.js"
+      },
+      "types": "./dist/workerd.d.ts",
+      "import": "./dist/workerd.js",
+      "default": "./dist/workerd.js"
+    },
+    "./edge-light": {
+      "types": "./dist/edge-light.d.ts",
+      "import": "./dist/edge-light.js",
+      "default": "./dist/edge-light.js"
+    },
+    "./workers": {
+      "types": "./dist/workers.d.ts",
+      "workerd": "./dist/workers-dummy.js",
+      "node": "./dist/workers.js",
+      "browser": "./dist/workers-parent.js",
+      "default": "./dist/workers-dummy.js"
+    },
+    "./html-to-image.js": {
+      "import": "./dist/html-to-image.js",
+      "default": "./dist/html-to-image.js"
+    },
+    "./react": {
+      "types": "./dist/react.d.ts",
+      "import": "./dist/react.js"
+    },
+    "./preact": {
+      "types": "./dist/preact.d.ts",
+      "import": "./dist/preact.js"
+    },
+    "./tailwind": {
+      "types": "./dist/tailwind.d.ts",
+      "import": "./dist/tailwind.js"
+    }
+  },
+  "files": [
+    "dist",
+    "README.md",
+    "LICENSE"
+  ],
+  "license": "MIT",
+  "dependencies": {
+    "commander": "15.0.0",
+    "worker-lib": "2.2.1"
+  },
+  "peerDependencies": {
+    "@unocss/core": "^66.6.5",
+    "@unocss/preset-wind4": "^66.6.5",
+    "preact": "^10.28.0",
+    "preact-render-to-string": "^6.6.0",
+    "react": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0",
+    "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0"
+  },
+  "peerDependenciesMeta": {
+    "@unocss/core": {
+      "optional": true
+    },
+    "@unocss/preset-wind4": {
+      "optional": true
+    },
+    "preact": {
+      "optional": true
+    },
+    "preact-render-to-string": {
+      "optional": true
+    },
+    "react": {
+      "optional": true
+    },
+    "react-dom": {
+      "optional": true
+    }
+  },
+  "devDependencies": {
+    "@types/node": "26.4.1",
+    "@types/react": "^19.2.18",
+    "@types/react-dom": "^19.2.7",
+    "rolldown": "^1.2.7",
+    "tsx": "^4.23.13",
+    "typescript": "^7.0.2",
+    "vitest": "^5.0.0"
+  }
+}