Show HN: Thumbor – open-source on-demand image cropping, resizing, and filters

Show HN: Thumbor – open-source on-demand image cropping, resizing, and filters(thumbor.org)

113 points by heynemann 12 years ago | 21 comments

cfstras 12 years ago |

> By upgrading your image server to thumbor you would go from 12989.07kb to 16106.04kb for 22 images (using WebP images).

On my gallery page:

> By upgrading your image server to thumbor you would go from 16687.68kb to 29581.33kb for 19 images (using WebP images).

All of my images get filtered through convert through convert(1) -quality 90, could that be a reason?

heynemann 12 years ago | |

Yes. Sometimes thumborize.me will get the image sizes weirdly. It's there mainly to give you an idea. The settings are the standard ones that come with thumbor. If you tinker with the settings you always get best results. I highly encourage you to try it on your site with different quality settings. Setting up thumbor in your machine takes like 2 minutes. Have a look at the getting started page. If you need any further help please do not hesitate to create an issue and we'll most definitely help you.

hcarvalhoalves 12 years ago |

Dealing with on-demand thumbnails is annoying, I've done something similar in the past [1].

In any case, transparently generating thumbnails from URLs is the saner solution, designers/editors might want to embed image of all sorts of sizes and aspect ratios and you can't always generate everything in batch - this is extremely common on news sites.

[1] https://github.com/hcarvalhoalves/django-rest-thumbnails

hackerboos 12 years ago | |

Anybody know of a rails equivalent?

gingerlime 12 years ago | | |

It looks like you could use thumbor (or any similar solution) as an external resource[0], so it doesn't matter what language it's written in.

That said, it usually feels safer to have something that works with the same stack.

We're using carrierwave, and it's pretty neat, but we had a few times where we had to scale thumbnails differently, and it turned out to be a pretty long batch operation, especially since we're storing images on S3.

I think that 'on-the-fly' conversion and caching could work better for larger sites that tend to change. Pre-processing doesn't scale so well.

[0] take a look at https://github.com/rafaelcaricio/thumbor_rails, which I believe is using https://github.com/thumbor/ruby-thumbor

EDIT: added links

p4bl0 12 years ago |

Nice work!

> By upgrading your image server to thumbor you would go from 0kb to 0kb for 0 images, thus saving NaN% (using WebP images).

Maybe a special message could be used in this specific case.

heynemann 12 years ago | |

Yep, that happens when we don't find any images in the DOM. I'll work it out to improve the wording...

aidanfeldman 12 years ago |

A similar app I worked on, which focuses on extensibility: http://magickly.afeld.me/

heynemann 12 years ago | |

Not sure how it compares, but thumbor is fully extensible. There are people using it with HBase, others with Amazon's S3 and Cloudfront, others with filesystem based solutions and yet others with redis or mongo backed images. Other than storage, you can extend loading images from different places, as well as changing the imaging library thumbor uses. You can also extend the filters or the detection mechanisms. Anyway, good to know about magickly.

gingerlime 12 years ago | | |

any tips on plugging-in any 3rd party image processing filters? Maybe I looked in the wrong place, but could only see storage plugins on the wiki.

For example, we have a ruby-based library for converting images for different types of colour-blindness[0]. It's available from ruby, or via the command line. How could we use it as a filter in thumbor?

[0] https://github.com/kenhub/shikimo

ceejayoz 12 years ago |

This looks like it has come a long way since the last time I played with it. We wound up building something internally, but it might be time to re-eval.

morenoh149 12 years ago |

on firefox maybe you should display a dummy webp image. Seems like FF doesn't support it yet, you should degrade gracefully in this case.

heynemann 12 years ago | |

Just saw it. You are absolutely right. My bad... Will fix it tomorrow.

exceptione 12 years ago | | |

Some people might downvote me for this (as happened before) but I have cookies disabled by default. Only if I need to interact with a website I am ok with traces and I allow cookies for that domain via the Cookie Controller add-on.

Now the strange thing: thumbor requires cookies in order to serve images. It requires quite lax settings since allowing cookies for thumborg.org as first party only doesn't suffice. I need to accept all possible cookies, I think because one offending cookie has domain .thumborg.org.

I think serving images should not depend on cookies, or is there a good reason?

heynemann 12 years ago | |

that's odd, I'm seeing all images here in my firefox in windows... What version of Firefox you using in what OS?

fourstar 12 years ago |

By upgrading your image server to thumbor you would go from 0kb to 0kb for 0 images, thus saving NaN% (using WebP images).

Did I break it?

heynemann 12 years ago | |

What website did you put into it? If your site loads images via javascript we don't capture it...

ZoF 12 years ago | | |

Would definitely recommend showing a message akin to 'no images detected' in that event.

Maybe with a few common reasons that might happen(such as the above)

Cool stuff though!

fourstar 12 years ago | | |

I don't load them via javascript, but I have an onError handler where I replace images with icons if they don't show up. The site is https://lifeprotips.com

tuananh 12 years ago |

> saving NaN%

LOL

https://dl.dropbox.com/s/o8o544awvvw92on/thumborize.me_-_Tes...