DEV Community

aben
aben

Posted on

Any performant solution to link to a thumbnail instead of an image

Hello friends,

I'm happy to be back and I hope you are doing well!

I have a question today. Is there in the web of today, a technology, library, API, standard or any solution to be able to have a thumbnail from an image living publicly on the internet on the fly ?

The reason is obvious, caring about UX so that in users browsers they have a thumbnail instead of the big picture (on the fly hopeful).

I think of a serverless function on AWS or other provider, to do the compression and resize on the fly ? what do you think ? any other
easier solution ?

Take care!

Top comments (7)

Collapse
 
bacloud22 profile image
aben • Edited

I ended up using Sharp, I was afraid of where to get the buffer from multer which is using a cloud storage with kind of scrambled promises on my code. Still afraid of errors (with resizing different media extensions, there must be errors in the future I think). But that's the solution for now.
For anyone looking for something similar check my code:
github.com/bacloud22/classified-ad...

Here I'm just uploading the resized picture, I would upload both buffers, the original and the resized... to be continued (possible solution: stackoverflow.com/a/64373736/1951298).

Collapse
 
manukanne profile image
Manuel Kanetscheider

Maybe this is worth a shot?docs.microsoft.com/en-us/azure/eve...

Collapse
 
bacloud22 profile image
aben

thanks Manuel, I will check what Microsoft Azure has to offer. (it would be a huge switch of technology, but lets see)

Collapse
 
manukanne profile image
Manuel Kanetscheider

It took a while, but I wrote a blog post about how to create thumbnails with Azure Computer Vision. You might want to check it out and maybe leave your feedback πŸ˜ƒ
dev.to/manukanne/serverless-thumbn...

Thread Thread
 
bacloud22 profile image
aben

As I said it would be a real headache to start using anything on azure. As for now I'm using Sharp on the fly in the app itself. Let's see after tests..

But Great article πŸ‘πŸ‘ thanks ☺️

Collapse
 
curiousdev profile image
CuriousDev

I would say it depends on the server technology, the server should resize it. You could do it also in the client after loading the image, but then it will still be loaded with its full size.

Collapse
 
bacloud22 profile image
aben

indeed, I'm thinking of a job turning or a callback on each upload, to both upload the picture and also make the compressed one.
thanks a lot