Cloudflare DevelopersCD
Cloudflare Developers10mo ago
11 replies
Sam

Image processing library?

I have a Worker function that uses Browser rendering and Puppeteer to capture a screenshot. I want to convert the image to 8bit grayscale.

Usually I would use a library like imagescript, upng-js but it didn't work with workers.

What is the best way to achive this?


Sample code that I tried.
    import { PNG } from 'imagescript';

    const browser = await puppeteer.launch();
    const page = await browser.newPage();
    
    // Take screenshot
    const img = await page.screenshot({ type: "png" });
    await browser.close();

    // Convert to grayscale using imagescript
    const buffer = new Uint8Array(img);
    const image = await PNG.decode(buffer);
    
    // Apply grayscale conversion
    image.grayscale();
    
    // For 8-bit grayscale specifically, potentially reduce color depth
    // The library's grayscale() gives you grayscale colors, but we can further reduce
    
    // Encode back to PNG
    const processedImageBuffer = await image.encode();


Error:
  ✘ [ERROR] No loader is configured for ".node" files:
  node_modules/imagescript/codecs/node/bin/arm64-darwin.node

      node_modules/imagescript/codecs/node/index.js:2:31:
        2 │ ...{ module.exports = require(`./bin/${arch()}-${platform()}.node`); }
Was this page helpful?