transloadit / uppy

The next open source file uploader for web browsers :dog:
https://uppy.io
MIT License
28.97k stars 1.99k forks source link

Compressor resize also re-compresses all images #3986

Open mjau-mjau opened 2 years ago

mjau-mjau commented 2 years ago

Initial checklist

Problem

When using the Compressor plugin to resize images larger than say 2000px, it will obviously re-compress all images that are beyond the given dimensions. However, it will also re-compress images that don't need resizing.

Goal I think the obvious target here, is to be able to resize images that are beyond certain dimensions, without affecting uploaded images that don't need resizing. Currently, you can't resize large images without also re-compressing all images, regardless of how small they are.

Solution

I'm not sure, but perhaps some compressor:file or compressor:filter event that can be used to decide if the file should be be processed by Compressor.js?

Alternatives

Probably no other alternatives. To me, this just seems like missing logic. It's not currently possible to resize large images on upload, without also re-compressing all images (regardless of size). Normal uploader logic would be to resize images larger than XX px, else just upload the image.

arturi commented 2 years ago

It's a Compressor plugin, so yes by default it compresses everything. Do you mean you want to only resize images larger than, say 2000px, and leave the other ones without compression? So ability to set rules, which images to pass to compressor.

mjau-mjau commented 2 years ago

Do you mean you want to only resize images larger than, say 2000px, and leave the other ones without compression?

Exactly.

So ability to set rules, which images to pass to compressor.

Yes, or perhaps a custom filter function that decides what images should be passed to Compressor.js.

It's a Compressor plugin, so yes by default it compresses everything.

I'm aware of that, but with the existence of very useful resize-options, it seems "unfortunate" that this cannot be achieved due to some logical limitation. From an UPLOADER perspective, it seems obvious that one may want to resize large images (for example 6000 px images straight from digital cameras), while leaving pre-resized <=2000 px images untouched, and of course without inadvertently affecting small images like 500 px.

For example, I have an app using Uppy for upload, and I added "Resize and compression" options. I would have preferred to just call it "Resize", as that seems most useful. However, since the toggle also forces compression on images that don't get resized, I probably need to include a warning text "[!] This option will also compress images that don't get resized".

As you say, it's a Compressor plugin, although I'm sure you would agree that we are kinda missing out on a useful feature due to logical implementation. You may ask if this is even Uppy's responsibility, as it simply makes Compressor.js available from a plugin ... I even asked this question @ fengyuanchen/compressorjs/issues/157, but in this case, why forward an image to Compressor.js in the first place if you don't want it resized or compressed? ... which then kinda points back to Uppy again ...

It might be slightly clumsy to integrate this logic into Uppy. The best I can think of, is some filter option.

uppy.use(Compressor, {
  filter: (image) => {
    return image.width > 2000 || image.height > 2000;
  }
})

If you use some kinda rules, it might get complicated, and with some boolean option onlyCompressResizedImages, you would need to also consider the other options in Compressor.js that decide if an image gets resized or not. The easiest might therefore be to just assign a custom filter.

Anyway, thanks for considering the request! 🙏