3
$\begingroup$

I've noticed that Stack Overflow uses lh3.googleusercontent.com to store and serve the profile images of each user. One of the features this website has is that you can easily request a resized version of the image by using the sz=XXpx url parameter in the image url. Google will resize the image at minimal loss of quality and not only that but the file size of the returned image is exceptionally small as well. Here's an example

It doesn't matter if you request a 3000px version of this image or a 100px version, the returned image will always have a reasonable quality. When I try to resize the same image using MS paint the quality will always be bad and the file size will always be a lot larger than the size of the resized image made with googleusercontent.

So how does this work? How is google able to return an image that is never blurry and that always has a very low filesize? For instance, the 100px version of the image in the example link is only 6kb in size.

I'm asking this because I'm building an app that should be able to create a resized image with low file size. It's able to resize with minimal quality loss but the file size is still rather large. So I'm wondering how google does this.

$\endgroup$
4
  • 1
    $\begingroup$ The thing doesn't do what you think it does; if you request a size that's significantly larger than the original file, you just get the original file, unscaled, or a really badly scaled version. For example, request 3000 px version of the picture you link to and tell to my face that this is well-compressed and very "high-quality" scaled. It's neither: lh3.googleusercontent.com/-GkDf_IkjjCY/AAAAAAAAAAI/AAAAAAAAAAA/… $\endgroup$ Aug 15, 2022 at 13:14
  • 1
    $\begingroup$ It's badly JPEG-overcompressed, and you can see the ringing from the original-sized JPEG compression, so: also badly scaled. $\endgroup$ Aug 15, 2022 at 13:19
  • $\begingroup$ @MarcusMüller what do you mean with the ringing? $\endgroup$
    – Maurice
    Aug 15, 2022 at 13:22
  • 1
    $\begingroup$ en.wikipedia.org/wiki/Ringing_artifacts $\endgroup$ Aug 15, 2022 at 13:30

1 Answer 1

2
$\begingroup$

Speed

Usually for delivery systems one can build a pyramid representation of the image in multiple resolutions.

Then, once one request a specific size it is being processed from the nearest higher resolution.

Quality

Google has developed some interesting Super Resolution methods over the years for quality enlargement of images. For instance, see Enhance! RAISR Sharp Images with Machine Learning.

With some caching it means they can serve better quality for images. For smaller images it will also mean low bandwidth budget.

Compression

There are also very optimized libraries for JPEG compression:

$\endgroup$
5
  • $\begingroup$ thank you for your answer. Do you know which of the three gives the best result? I run Java in the backend. I also see that the sharp compression library is missing in your list. Is this a good compression library as well or are the other three you've listed better? $\endgroup$
    – Maurice
    Aug 17, 2022 at 12:52
  • $\begingroup$ The package TinyJPG is commercial, so I am not sure. I once did a comparison between Mozilla and Turbo, I think the differences were mainly subjective. So it is better you compare them. $\endgroup$
    – Royi
    Aug 19, 2022 at 10:59
  • $\begingroup$ don't be greedy. I already accepted your post as the answer. $\endgroup$
    – Maurice
    Aug 19, 2022 at 11:10
  • $\begingroup$ I understand that asking for more questions and time from people isn't greedy while asking for appreciation is. $\endgroup$
    – Royi
    Aug 19, 2022 at 19:07
  • $\begingroup$ i'm going to give you an extra point for adding Google Guetzli $\endgroup$
    – Maurice
    Sep 20, 2022 at 13:14

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.