'ThumbHash', which further evolved BlurHash that displays image placeholders when loading sites and applications, can express more detailed parts with the same amount of data & encode aspect ratio & improve color accuracy & image with transparency is also OK
' ThumbHash ' is a tool that generates a super lightweight image of about 20 to 30 bytes that 'somehow understands the atmosphere' from a large size image.
ThumbHash: A very compact representation of an image placeholder
If a site or app takes a long time to load, not only will users leave while loading, but it will also have various negative effects, such as lowering Google search rankings . Image files, in particular, take a considerable amount of time to read depending on the speed and stability of the line, so the general method is to secure only the display space and load it later.
It's OK just to reserve space for the display, but it's not good if the overall impression of the screen changes drastically before and after the image is loaded. Therefore, a tool called BlurHash was developed, and by using BlurHash, it is now possible to generate an ultra-lightweight image that expresses only the overall atmosphere from the original image.
And ThumbHash is a tool that further evolved BlurHash. In addition to being able to express more detailed parts with the same amount of data, advantages such as encoding the aspect ratio, improving color accuracy, and supporting image data with transparency are stated.
ThumbHash's introduction page provides a demo. When you click the 'Upload' button and upload the image, the encoded data will appear on the right.
When I put the logo of GIGAZINE, it looks like this. The amount of data was 17 bytes. The black color is emphasized a little too much, but the atmosphere seems to be grasped.
It is like this if it is a page about GIGAZINE . This is also 17 bytes.
published on GitHub , and a commentary on the algorithm is also posted at the bottom of the introduction page , so please check it if you are interested.
In addition, ThumbHash is developed as an open source, the source code is