Code Monkey home page Code Monkey logo

Comments (2)

kleisauke avatar kleisauke commented on July 30, 2024

Sorry, this dropped off my radar. Currently, wasm-vips doesn't support native file system access in environments other than Node.js, mainly because these environments typically reuses the web ES6 module. Emscripten issue emscripten-core/emscripten#12203 might be relevant here.

On the web, the whole filesystem is virtualized (see MEMFS). So, you need to preload the file first, for example on Deno:

import Vips from 'https://cdn.jsdelivr.net/npm/wasm-vips/lib/vips-es6.js';

const vips = await Vips({
  // Optimize startup time by disabling the dynamic modules
  dynamicLibraries: [],
  preRun: async (module) => {
    // Preload banana.webp
    module.FS.createDataFile('/', 'banana.webp', await Deno.readFile('playground/src/images/banana.webp'), true, false);
  }
});

// Load an image from a preloaded file
const im = vips.Image.newFromFile('banana.webp[n=-1]', {
  access: vips.Access.sequential // 'sequential'
});

// Write the result to a GIF file
const outBuffer = im.writeToBuffer('.gif');
await Deno.writeFile('banana.gif', outBuffer);

// Memory management
im.delete();

// Exit the Deno runtime (i.e. a more "commandline" experience)
Deno.exit();
$ deno run --allow-net --allow-read --allow-write test.js

it seems using jsdelivr the wasm files are loaded again over the net every run?

IIUC, Deno reuses a module from its cache without having to fetch it again on subsequent runs, but I'm not sure how Deno manages Wasm files internally.

could we perhaps somehow have these zipped on new releases?

wasm-vips will only be distributed via npmjs.com; there are currently no plans to distribute it through other channels.

allow vips to process data in a more streaming manner

I think the source/target API of libvips would be suitable for this.
https://www.libvips.org/2019/11/29/True-streaming-for-libvips.html

it('custom', function () {
const stream = vips.FS.open(Helpers.jpegFile, 'r');
const source = new vips.SourceCustom();
source.onRead = (ptr, size) =>
BigInt(vips.FS.read(stream, vips.HEAPU8, ptr, vips.bigintToI53Checked(size)));
source.onSeek = (offset, whence) =>
BigInt(vips.FS.llseek(stream, vips.bigintToI53Checked(offset), whence));
const image = vips.Image.newFromSource(source, '', {
access: 'sequential'
});
const image2 = vips.Image.newFromFile(Helpers.jpegFile, {
access: 'sequential'
});
expect(image.subtract(image2).abs().max()).to.equal(0);
vips.FS.close(stream);
});

it would be great if we were able to work with ReadableStream in and WritableStream out

Indeed, this would be a great addition. It can probably be implemented using a new pair of Image.newFromStream() / image.writeToStream() functions.

from wasm-vips.

jtoppine avatar jtoppine commented on July 30, 2024

Thank you, lot of valuable information there. And no worries. I ended up interfacing with native vips cli (for now), and turned out working very well. Still interested in using wasm-vips sometime in the future, though!

I was wondering what types the Source & Target related methods were referring to. Indeed it looks like one could use that kind of lower level interface to make an adapter that would work with almost any type of IO access, including ReadableStream/WritableStream. Feels like a nice project idea for a deno.land/x module, a wrapper of sorts that would feel more "deno native". Might even take up the challenge sometime in the future, no promises though!

On the other hand, having newFromStream/writeToStream methods built into wasm-vips might make sense outside of deno too, since them being standard web apis, could be useful in some purely client side browser apps.

from wasm-vips.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.