wasm-image-optimization 1.2.1 → 1.2.3

package/README.md

@@ -17,6 +17,31 @@
 - Web Worker (Browser) Multi process  
   `import { optimizeImage } from 'wasm-image-optimization/web-worker';`
 
+## Samples
+
+https://github.com/SoraKumo001/wasm-image-optimization-samples
+
+### cloudflare-ogp
+
+Sample for generating OGP images on Cloudflare Workers.
+
+### deno-ogp
+
+Sample for generating OGP images on Deno.
+
+### cloudflare-image-optimization
+
+Sample for image optimization on Cloudflare Workers.
+
+### deno-image-optimization
+
+Sample for image optimization on Deno.
+
+### node-image-convert
+
+Sample for converting image formats on Node.js.  
+Single-threaded and multi-threaded operation can be selected.
+
 ## WebWorker on Vite
 
 - vite.config.ts
@@ -68,292 +93,3 @@ optimizeImageExt({
   - png
   - webp
   - avif(default)
-
-## usage
-
-### Node.js (CLI)
-
-```ts
-import fs from "node:fs";
-import {
-  optimizeImage,
-  waitAll,
-  close,
-} from "wasm-image-optimization/node-worker";
-
-const formats = ["webp", "jpeg", "png", "avif"] as const;
-
-const main = async () => {
-  fs.mkdirSync("./image_output", { recursive: true });
-  const files = fs.readdirSync("./images");
-  for (const file of files) {
-    const image = fs.readFileSync(`./images/${file}`);
-    for (const format of formats) {
-      optimizeImage({
-        image,
-        quality: 100,
-        format,
-        width: 1000,
-      }).then((encoded) => {
-        console.log(
-          !!encoded,
-          file,
-          format,
-          encoded && `${Math.floor(encoded.length / 1024)}KB`
-        );
-        if (encoded) {
-          const fileName = file.split(".")[0];
-          fs.promises.writeFile(`image_output/${fileName}.${format}`, encoded);
-        }
-      });
-    }
-  }
-  await waitAll(); // Wait for all workers to finish before exiting the program.
-  close(); // Close all workers
-  console.log("exit");
-};
-main();
-```
-
-### Next.js image optimization with Cloudflare
-
-```ts
-import { optimizeImage } from "wasm-image-optimization";
-
-const isValidUrl = (url: string) => {
-  try {
-    new URL(url);
-    return true;
-  } catch (err) {
-    return false;
-  }
-};
-
-const handleRequest = async (
-  request: Request,
-  _env: {},
-  ctx: ExecutionContext
-): Promise<Response> => {
-  const accept = request.headers.get("accept");
-  const isWebp =
-    accept
-      ?.split(",")
-      .map((format) => format.trim())
-      .some((format) => ["image/webp", "*/*", "image/*"].includes(format)) ??
-    true;
-  const isAvif =
-    accept
-      ?.split(",")
-      .map((format) => format.trim())
-      .some((format) => ["image/avif", "*/*", "image/*"].includes(format)) ??
-    true;
-
-  const url = new URL(request.url);
-
-  const params = url.searchParams;
-  const imageUrl = params.get("url");
-  if (!imageUrl || !isValidUrl(imageUrl)) {
-    return new Response("url is required", { status: 400 });
-  }
-
-  const cache = caches.default;
-  url.searchParams.append("webp", isWebp.toString());
-  const cacheKey = new Request(url.toString());
-  const cachedResponse = await cache.match(cacheKey);
-  if (cachedResponse) {
-    return cachedResponse;
-  }
-
-  const width = params.get("w");
-  const quality = params.get("q");
-
-  const [srcImage, contentType] = await fetch(imageUrl, {
-    cf: { cacheKey: imageUrl },
-  })
-    .then(async (res) =>
-      res.ok
-        ? ([await res.arrayBuffer(), res.headers.get("content-type")] as const)
-        : []
-    )
-    .catch(() => []);
-
-  if (!srcImage) {
-    return new Response("image not found", { status: 404 });
-  }
-
-  if (contentType && ["image/svg+xml", "image/gif"].includes(contentType)) {
-    const response = new Response(srcImage, {
-      headers: {
-        "Content-Type": contentType,
-        "Cache-Control": "public, max-age=31536000, immutable",
-      },
-    });
-    ctx.waitUntil(cache.put(cacheKey, response.clone()));
-    return response;
-  }
-
-  const format = isAvif
-    ? "avif"
-    : isWebp
-      ? "webp"
-      : contentType === "image/jpeg"
-        ? "jpeg"
-        : "png";
-  const image = await optimizeImage({
-    image: srcImage,
-    width: width ? parseInt(width) : undefined,
-    quality: quality ? parseInt(quality) : undefined,
-    format,
-  });
-  const response = new Response(image, {
-    headers: {
-      "Content-Type": `image/${format}`,
-      "Cache-Control": "public, max-age=31536000, immutable",
-      date: new Date().toUTCString(),
-    },
-  });
-  ctx.waitUntil(cache.put(cacheKey, response.clone()));
-  return response;
-};
-
-export default {
-  fetch: handleRequest,
-};
-```
-
-- next.config.js
-
-```js
-/**
- * @type { import("next").NextConfig}
- */
-const config = {
-  images: {
-    path: "https://xxx.yyy.workers.dev/",
-  },
-};
-export default config;
-```
-
-### Deno Deploy
-
-#### Parameters
-
-| Name | Type   | Description |
-| ---- | ------ | ----------- |
-| url  | string | Image URL   |
-| q    | number | Quality     |
-| w    | number | Width       |
-
-https://xxxx.deno.dev/?url=https://xxx.png&q=80&w=200
-
-```ts
-import { optimizeImage } from "npm:wasm-image-optimization/esm";
-
-const isValidUrl = (url: string) => {
-  try {
-    new URL(url);
-    return true;
-  } catch (_e) {
-    return false;
-  }
-};
-
-const isType = (accept: string | null, type: string) => {
-  return (
-    accept
-      ?.split(",")
-      .map((format) => format.trim())
-      .some((format) => [`image/${type}`, "*/*", "image/*"].includes(format)) ??
-    true
-  );
-};
-
-Deno.serve(async (request) => {
-  const url = new URL(request.url);
-  const params = url.searchParams;
-  const type = ["avif", "webp", "png", "jpeg"].find(
-    (v) => v === params.get("type")
-  ) as "avif" | "webp" | "png" | "jpeg" | undefined;
-  const accept = request.headers.get("accept");
-  const isAvif = isType(accept, "avif");
-  const isWebp = isType(accept, "webp");
-
-  const cache = await caches.open(
-    `image-${isAvif ? "-avif" : ""}${isWebp ? "-webp" : ""}`
-  );
-
-  const cached = await cache.match(request);
-  if (cached) {
-    return cached;
-  }
-
-  const imageUrl = params.get("url");
-  if (!imageUrl || !isValidUrl(imageUrl)) {
-    return new Response("url is required", { status: 400 });
-  }
-
-  if (isAvif) {
-    url.searchParams.append("avif", isAvif.toString());
-  } else if (isWebp) {
-    url.searchParams.append("webp", isWebp.toString());
-  }
-
-  const cacheKey = new Request(url.toString());
-  const cachedResponse = await cache.match(cacheKey);
-  if (cachedResponse) {
-    return cachedResponse;
-  }
-
-  const width = params.get("w");
-  const quality = params.get("q");
-
-  const [srcImage, contentType] = await fetch(imageUrl)
-    .then(async (res) =>
-      res.ok
-        ? ([await res.arrayBuffer(), res.headers.get("content-type")] as const)
-        : []
-    )
-    .catch(() => []);
-
-  if (!srcImage) {
-    return new Response("image not found", { status: 404 });
-  }
-
-  if (contentType && ["image/svg+xml", "image/gif"].includes(contentType)) {
-    const response = new Response(srcImage, {
-      headers: {
-        "Content-Type": contentType,
-        "Cache-Control": "public, max-age=31536000, immutable",
-      },
-    });
-    cache.put(request, response.clone());
-    return response;
-  }
-
-  const format =
-    type ??
-    (isAvif
-      ? "avif"
-      : isWebp
-        ? "webp"
-        : contentType === "image/jpeg"
-          ? "jpeg"
-          : "png");
-  const image = await optimizeImage({
-    image: srcImage,
-    width: width ? parseInt(width) : undefined,
-    quality: quality ? parseInt(quality) : undefined,
-    format,
-  });
-  const response = new Response(image, {
-    headers: {
-      "Content-Type": `image/${format}`,
-      "Cache-Control": "public, max-age=31536000, immutable",
-      date: new Date().toUTCString(),
-    },
-  });
-  cache.put(request, response.clone());
-  return response;
-});
-```

package/dist/cjs/node/node-worker.js

@@ -4,9 +4,9 @@ var __commonJS = (cb, mod) => function __require() {
   return mod || (0, cb[__getOwnPropNames(cb)[0]])((mod = { exports: {} }).exports, mod), mod.exports;
 };
 
-// node_modules/.pnpm/worker-lib@1.0.4/node_modules/worker-lib/dist/cjs/node.js
+// node_modules/.pnpm/worker-lib@2.0.0/node_modules/worker-lib/dist/cjs/node.js
 var require_node = __commonJS({
-  "node_modules/.pnpm/worker-lib@1.0.4/node_modules/worker-lib/dist/cjs/node.js"(exports2) {
+  "node_modules/.pnpm/worker-lib@2.0.0/node_modules/worker-lib/dist/cjs/node.js"(exports2) {
     "use strict";
     Object.defineProperty(exports2, "__esModule", { value: true });
     exports2.initWorker = exports2.createWorker = void 0;

package/dist/esm/web-worker.js

@@ -3929,7 +3929,7 @@
     }
   });
 
-  // node_modules/.pnpm/worker-lib@1.0.4/node_modules/worker-lib/dist/esm/index.js
+  // node_modules/.pnpm/worker-lib@2.0.0/node_modules/worker-lib/dist/esm/index.js
   var initWorker = (WorkerProc) => {
     const worker = self;
     worker.addEventListener("message", async (e) => {

package/dist/web-worker/index.d.ts

@@ -1,4 +1,5 @@
 import { type OptimizeParams } from "../lib/optimizeImage.js";
+declare const setLimit: (limit: number) => void, close: () => void;
 export declare const optimizeImage: (params: OptimizeParams) => Promise<Uint8Array<ArrayBuffer> | undefined>;
 export declare const optimizeImageExt: (params: OptimizeParams) => Promise<{
     data: Uint8Array<ArrayBuffer>;
@@ -7,3 +8,4 @@ export declare const optimizeImageExt: (params: OptimizeParams) => Promise<{
     width: number;
     height: number;
 } | undefined>;
+export { setLimit, close };

package/dist/web-worker/index.js

@@ -1,5 +1,6 @@
 import { createWorker } from "worker-lib";
-const execute = createWorker(() => new Worker(new URL("../esm/web-worker.js", import.meta.url)), 5);
+const { execute, setLimit, close } = createWorker(() => new Worker(new URL("../esm/web-worker.js", import.meta.url)), 5);
 export const optimizeImage = async (params) => execute("optimizeImage", params);
 export const optimizeImageExt = async (params) => execute("optimizeImageExt", params);
+export { setLimit, close };
 //# sourceMappingURL=index.js.map

package/dist/web-worker/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/web-worker/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,YAAY,CAAC;AAQ1C,MAAM,OAAO,GAAG,YAAY,CAC1B,GAAG,EAAE,CAAC,IAAI,MAAM,CAAC,IAAI,GAAG,CAAC,sBAAsB,EAAE,MAAM,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,EAClE,CAAC,CACF,CAAC;AAEF,MAAM,CAAC,MAAM,aAAa,GAAG,KAAK,EAAE,MAAsB,EAAE,EAAE,CAC5D,OAAO,CAAC,eAAe,EAAE,MAAM,CAAC,CAAC;AAEnC,MAAM,CAAC,MAAM,gBAAgB,GAAG,KAAK,EAAE,MAAsB,EAAE,EAAE,CAC/D,OAAO,CAAC,kBAAkB,EAAE,MAAM,CAAC,CAAC","sourcesContent":["import { createWorker } from \"worker-lib\";\nimport {\n  _optimizeImage,\n  _optimizeImageExt,\n  type OptimizeParams,\n} from \"../lib/optimizeImage.js\";\nimport type { WorkerType } from \"../esm/_web-worker.js\";\n\nconst execute = createWorker<WorkerType>(\n  () => new Worker(new URL(\"../esm/web-worker.js\", import.meta.url)),\n  5\n);\n\nexport const optimizeImage = async (params: OptimizeParams) =>\n  execute(\"optimizeImage\", params);\n\nexport const optimizeImageExt = async (params: OptimizeParams) =>\n  execute(\"optimizeImageExt\", params);\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/web-worker/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,YAAY,CAAC;AAQ1C,MAAM,EAAE,OAAO,EAAE,QAAQ,EAAE,KAAK,EAAE,GAAG,YAAY,CAC/C,GAAG,EAAE,CAAC,IAAI,MAAM,CAAC,IAAI,GAAG,CAAC,sBAAsB,EAAE,MAAM,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,EAClE,CAAC,CACF,CAAC;AAEF,MAAM,CAAC,MAAM,aAAa,GAAG,KAAK,EAAE,MAAsB,EAAE,EAAE,CAC5D,OAAO,CAAC,eAAe,EAAE,MAAM,CAAC,CAAC;AAEnC,MAAM,CAAC,MAAM,gBAAgB,GAAG,KAAK,EAAE,MAAsB,EAAE,EAAE,CAC/D,OAAO,CAAC,kBAAkB,EAAE,MAAM,CAAC,CAAC;AAEtC,OAAO,EAAE,QAAQ,EAAE,KAAK,EAAE,CAAC","sourcesContent":["import { createWorker } from \"worker-lib\";\nimport {\n  _optimizeImage,\n  _optimizeImageExt,\n  type OptimizeParams,\n} from \"../lib/optimizeImage.js\";\nimport type { WorkerType } from \"../esm/_web-worker.js\";\n\nconst { execute, setLimit, close } = createWorker<WorkerType>(\n  () => new Worker(new URL(\"../esm/web-worker.js\", import.meta.url)),\n  5\n);\n\nexport const optimizeImage = async (params: OptimizeParams) =>\n  execute(\"optimizeImage\", params);\n\nexport const optimizeImageExt = async (params: OptimizeParams) =>\n  execute(\"optimizeImageExt\", params);\n\nexport { setLimit, close };\n"]}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "wasm-image-optimization",
   "description": "Optimize images with wasm on edge runtime",
-  "version": "1.2.1",
+  "version": "1.2.3",
   "scripts": {
     "test": "yarn ts-node test",
     "lint:fix": "eslint --fix src/ && prettier -w src",
@@ -92,7 +92,7 @@
   },
   "license": "MIT",
   "dependencies": {
-    "worker-lib": "1.0.4"
+    "worker-lib": "2.0.2"
   },
   "devDependencies": {
     "@eslint/js": "9.21.0",