JonasKruckenberg / imagetools

Load and transform images using a toolbox :toolbox: of custom import directives!
MIT License
916 stars 56 forks source link

Ability to use in webcontainers #368

Open benmccann opened 2 years ago

benmccann commented 2 years ago

It appears next/image can use squoosh or sharp. It would be nice if imagetools could as well. The motivation for this is that I'd love to include imagetools in the default SvelteKit template. However, sharp would not work with StackBlitz and so right now if I were to include imagetools in the template it would break https://node.new/sveltekit

We might want it to be an option as sharp is much faster and would probably be preferred for most users: https://sharp.pixelplumbing.com/performance

JonasKruckenberg commented 2 years ago

Interesting idea 🤔 which library would one use for this? And how would we allow users to choose which "backend" to use?

benmccann commented 2 years ago

The alternate library is called squoosh. I was thinking the option could be passed to the plugin during initialization

benmccann commented 1 year ago

Better might be if we could get a wasm version of sharp: https://github.com/stackblitz/webcontainer-core/issues/147#issuecomment-855642099

JonasKruckenberg commented 1 year ago

Better might be if we could get a wasm version of sharp: stackblitz/webcontainer-core#147 (comment)

I looked into warm builds of sharp at the beginning of this projects (actually for being able to create an interactive demo website) and IMO this would be the best option.

benmccann commented 1 year ago

Hmm, looks like squoosh is no longer maintained: https://www.npmjs.com/package/@squoosh/lib

JonasKruckenberg commented 1 year ago

Ouf that's tough, so the only way forward here would be a wasm build of sharp I guess

benmccann commented 1 year ago

Figured out how to detect if we're running on webcontainers: https://github.com/stackblitz/viteconf/blob/main/nuxt.config.ts#L7-L17

Potentially we could use this to automatically choose another backend or just disable the plugin while logging a warning that we're doing so

lovell commented 2 months ago

As of v0.33.0+ sharp provides prebuilt WebAssembly binaries and should Just Work on webcontainers (although there is a further possible improvement detailed at https://github.com/stackblitz/webcontainer-core/issues/1236).