wasm-image-optimization 0.0.4 → 0.0.6

package/README.md

@@ -1,5 +1,27 @@
 # wasm-image-optimization
 
+- Cloudflare workers  
+  `import { optimizeImage } from 'wasm-image-optimization';`
+- Edge runtime  
+  `import { optimizeImage } from 'wasm-image-optimization/edge';`
+- Node runtime  
+  `import { optimizeImage } from 'wasm-image-optimization/node';`
+
+- function
+
+```ts
+// quality: 1-100
+optimizeImage({image: ArrayBuffer, width?: number, height?:number,quality?: number}): Promise<ArrayBuffer>
+```
+
+- source format
+  - jpeg
+  - png
+  - webp
+  - svg
+- output format
+  - webp
+
 # usage
 
 Next.js image optimization with Cloudflare
@@ -8,30 +30,55 @@ Next.js image optimization with Cloudflare
 import { optimizeImage } from 'wasm-image-optimization';
 export interface Env {}
 
+const isValidUrl = (url: string) => {
+  try {
+    new URL(url);
+    return true;
+  } catch (err) {
+    return false;
+  }
+};
+
 const handleRequest = async (
   request: Request,
   _env: Env,
-  _ctx: ExecutionContext
+  ctx: ExecutionContext
 ): Promise<Response> => {
-  const params = new URL(request.url).searchParams;
-  const url = params.get('url');
-  if (!url) {
+  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;
+  const cachedResponse = await cache.match(new Request(url.toString(), request));
+  if (cachedResponse) {
+    return cachedResponse;
+  }
+
   const width = params.get('w');
   const quality = params.get('q');
-  const srcImage = await fetch(url).then((res) => res.arrayBuffer());
+
+  const srcImage = await fetch(imageUrl, { cf: { cacheKey: imageUrl } })
+    .then((res) => (res.ok ? res.arrayBuffer() : null))
+    .catch((e) => null);
+
+  if (!srcImage) {
+    return new Response('image not found', { status: 404 });
+  }
   const image = await optimizeImage({
     image: srcImage,
     width: width ? parseInt(width) : undefined,
     quality: quality ? parseInt(quality) : undefined,
   });
-  return new Response(image, {
+  const response = new Response(image, {
     headers: {
       'Content-Type': 'image/webp',
       'Cache-Control': 'public, max-age=31536000, immutable',
     },
   });
+  ctx.waitUntil(cache.put(request, response.clone()));
+  return response;
 };
 
 export default {

package/dist/cjs/index.js

@@ -1,9 +1,15 @@
-import LibImage from './libImage.js';
-import WASM from '../esm/libImage.wasm';
-const libImage = LibImage({
-    instantiateWasm: async (imports, receiver) => {
-        receiver(await WebAssembly.instantiate(WASM, imports));
-    },
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.optimizeImage = void 0;
+const libImage_1 = __importDefault(require("../workers/libImage"));
+const path_1 = __importDefault(require("path"));
+const fs_1 = __importDefault(require("fs"));
+const libImage = (0, libImage_1.default)({
+    wasmBinary: fs_1.default.readFileSync(path_1.default.resolve(__dirname, '../esm/libImage.wasm')),
 });
-export const optimizeImage = async ({ image, width = 0, height = 0, quality = 100, }) => libImage.then(({ optimize }) => optimize(image, width, height, quality));
+const optimizeImage = async ({ image, width = 0, height = 0, quality = 100, }) => libImage.then(({ optimize }) => optimize(image, width, height, quality));
+exports.optimizeImage = optimizeImage;
 //# sourceMappingURL=index.js.map

package/dist/cjs/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/cjs/index.ts"],"names":[],"mappings":"AAAA,OAAO,QAAQ,MAAM,eAAe,CAAC;AACrC,OAAO,IAAI,MAAM,sBAAsB,CAAC;AAExC,MAAM,QAAQ,GAAG,QAAQ,CAAC;IACxB,eAAe,EAAE,KAAK,EAAE,OAAO,EAAE,QAAQ,EAAE,EAAE;QAC3C,QAAQ,CAAC,MAAM,WAAW,CAAC,WAAW,CAAC,IAAI,EAAE,OAAO,CAAC,CAAC,CAAC;IACzD,CAAC;CACF,CAAC,CAAC;AAEH,MAAM,CAAC,MAAM,aAAa,GAAG,KAAK,EAAE,EAClC,KAAK,EACL,KAAK,GAAG,CAAC,EACT,MAAM,GAAG,CAAC,EACV,OAAO,GAAG,GAAG,GAMd,EAAE,EAAE,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC,EAAE,QAAQ,EAAE,EAAE,EAAE,CAAC,QAAQ,CAAC,KAAK,EAAE,KAAK,EAAE,MAAM,EAAE,OAAO,CAAC,CAAC,CAAC","sourcesContent":["import LibImage from './libImage.js';\nimport WASM from '../esm/libImage.wasm';\n\nconst libImage = LibImage({\n  instantiateWasm: async (imports, receiver) => {\n    receiver(await WebAssembly.instantiate(WASM, imports));\n  },\n});\n\nexport const optimizeImage = async ({\n  image,\n  width = 0,\n  height = 0,\n  quality = 100,\n}: {\n  image: BufferSource;\n  width?: number;\n  height?: number;\n  quality?: number;\n}) => libImage.then(({ optimize }) => optimize(image, width, height, quality));\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/cjs/index.ts"],"names":[],"mappings":";;;;;;AAAA,mEAA2C;AAC3C,gDAAwB;AACxB,4CAAoB;AAEpB,MAAM,QAAQ,GAAG,IAAA,kBAAQ,EAAC;IACxB,UAAU,EAAE,YAAE,CAAC,YAAY,CAAC,cAAI,CAAC,OAAO,CAAC,SAAS,EAAE,sBAAsB,CAAC,CAAC;CAC7E,CAAC,CAAC;AAEI,MAAM,aAAa,GAAG,KAAK,EAAE,EAClC,KAAK,EACL,KAAK,GAAG,CAAC,EACT,MAAM,GAAG,CAAC,EACV,OAAO,GAAG,GAAG,GAMd,EAAE,EAAE,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC,EAAE,QAAQ,EAAE,EAAE,EAAE,CAAC,QAAQ,CAAC,KAAK,EAAE,KAAK,EAAE,MAAM,EAAE,OAAO,CAAC,CAAC,CAAC;AAVlE,QAAA,aAAa,iBAUqD","sourcesContent":["import LibImage from '../workers/libImage';\nimport path from 'path';\nimport fs from 'fs';\n\nconst libImage = LibImage({\n  wasmBinary: fs.readFileSync(path.resolve(__dirname, '../esm/libImage.wasm')),\n});\n\nexport const optimizeImage = async ({\n  image,\n  width = 0,\n  height = 0,\n  quality = 100,\n}: {\n  image: BufferSource;\n  width?: number;\n  height?: number;\n  quality?: number;\n}) => libImage.then(({ optimize }) => optimize(image, width, height, quality));\n"]}