Ask HN: Best Self-Hosted, Server-Side Image Optimization Tools?
Compressing images is extremely important for web performance. There are several desktop apps (e.g., ImageOptim, Trimage, ImageAlpha) and web services (e.g., TinyPNG, Kraken, Cloudinary, Imgix, CompressPNG, ImageOptim) that perform optimizations.
Thumbor (http://thumbor.org/ ) is a tool that can be installed locally in an application architecture. However, it is focused on cropping & resizing, though it can also transcode to WebP and call external optimizers.
What is the most complete solution you are aware of that compresses & optimizes png, jpeg, and webp and can be operated on a server? It should not only be able to optimize as part of the build process but also in response to user-generated content.
40 comments
[ 380 ms ] story [ 1445 ms ] threadTbh the UGC side is just triggering the "build process side" as the upload occurs.
As far as best,
https://github.com/MediaCrush/MediaCrush/blob/b32e2752d1a19d...
I'd suggest you look there for some decent examples of how to go about it. They may be defunct but I use a similar approach (slightly different knob tweaks with the same binaries) and it works fine. May not be 100% optimal but its good enough imo.
Be especially careful with these utilities when running them on UGC. PNG / JPEG bombs can easily cause OOM or CPU DoS conditions etc.
[1] http://getoptimage.com
We have been processing >3k images/day and >60k images/month.
The only tool I ever found which does this job reliable even for huge images is http://www.vips.ecs.soton.ac.uk .
-thumbnail causes ImageMagick to embed "freedesktop.org Thumbnail Managing Standard" metadata into the output image. Such metadata includes the full local path (!). I found this by accident on our wiki (Mediawiki, which uses ImageMagick).
https://phabricator.wikimedia.org/T108616
As for metadata, today I decided to add it back in.
https://www.gs1.org/sites/default/files/docs/gdsn/Product_Im...
For ecommerce it will eventally help to have product data, e.g. brand, product name etc embedded in the image.
My other tip if you go the Imagemagick/PAGESPEED route then you can use 4:2:2 colour space and ditch half the bits used for chroma.
https://github.com/haraldk/TwelveMonkeys
Snippets:
1. Resizing with imagemagick: https://bash.rocks/Gxlg31/3
2. Resizing and convert to webp: https://bash.rocks/7J1jgB/1
After creating the snippet, you could either use GET https://bash.rocks/0Be95B (query parameters become environment variable) or POST https://bash.rocks/jJggWJ (request body become stdin).
It's not hard to roll your backend like this for private usage (simply exec from node). I'm also working on an open source release.
It compresses and optimizes png, gif, and jpeg, creates webp for browsers that support it, inlines small images into your html, longcaches images, and even creates srcsets.
Images are complicated and important enough that I don't see that changing any time soon.
Don't get me wrong: I'm a big fan of FOSS, and I think it's great to have in-house image management solutions based on FOSS tools like ImageMagick, mod_pagespeed and thumbor. And if your website is relatively small and the image workflows are relatively simple, that might very well be the best solution.
But I also think that for companies who just need some image management solution for their website or app, it can make a lot of sense to use an external service. It is simply a matter of dev effort and risk management. It makes more sense to have your devs focus on the core business. Building some simple in-house image management infrastructure is not that hard, but what when the next ImageTragick happens, or some new image format arrives, or browsers get new responsive image features which require more variants or server-side cleverness? Do you really want your devs to have to think about that stuff? Maybe, maybe not. If not, then moving it to an external cloud service does make sense.
Disclaimer: I work at Cloudinary; I'm also the creator of FLIF (https://github.com/FLIF-hub/FLIF).
It works really well for UGC as an ondemand optimizer but you can easily make some URL calls to include it in the build time as well.
[1] https://github.com/APSL/docker-thumbor
However with the recent addition by cloudinary (https://webspeedtest.cloudinary.com), the tool is awesome for me.
I originally tried to use Google Pagespeed but I was getting some strange error message from image compression.