New Telegram animated image format

[SolidComp]

Hi all — Telegram just pushed an update that includes animated stickers using a format they developed called .TGS. It looks like it's extremely compact, and supports 60 frames per second. See the screenshot:



They said that it's "Lottie-based". I didn't know what that was, but I think it's this project from airbnb.

[Shelwien]

https://github.com/telegramdesktop/t...ceFiles/lottie

deflate?

[SolidComp]

https://github.com/telegramdesktop/t...ceFiles/lottie

deflate?

Do you see it in the code? I don't see any obvious deflate files.

[Shelwien]

https://github.com/telegramdesktop/t...mation.cpp#L25

[SolidComp]

Interesting. It's a vector format and I guess it's not surprising that DEFLATE could help with that. It's much better than GIF but it's easy to beat GIF since it's 32 years old. It would be interesting to see how much better TGS could be with zstd, brotli, or one of the Oodle compressors.

[schnaader]

Some more infos: Lottie itself seems to be a JSON-based format, but at the moment I'm not sure if the Telegram format is just a GZip wrapper around this or more is involved. At least there are some requirements for Lottie files to be valid .tgs - though the list and this issue seems to indicate these are just "cosmetic" requirements (size, framerate, length of animation) or limited functionality regarding the whole Adobe After Effects/Lottie superset. They suggest a Adobe After effects plugin there for creation which makes it harder to create some test animations, also I don't see where the Telegram Desktop application stores (animated) stickers, they seem to have some containered structure instead.

The site LottieFiles.com has some user created Lottie animation examples, most of them are in JSON format with minimal formatting and short strings, like this (fragment of the beginning of a file):

{"v":"5.5.0","fr":24,"ip":0,"op":57,"w":472,"h":472,"nm":"Heart 03","ddd":0,"assets":[],"layers":[{"ddd":0,"ind":3,"ty":4,"nm":"Drop 12","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":181,"ix":10},"p":{"a":0,"k":[236,235.5,0],"ix":2},"a":{"a":0,"k":[0,0,0],"ix":1},"s":{"a":0,"k":[44,44,100],"ix":6}},"ao":0,"shapes":[{"ty":"gr","it":[{"ind":0,"ty":"sh","ix":1,"ks":{"a":1,"k":[{"i":{"x":0.833,"y":0.833},"o":{"x":0.167,"y":0.167},"t":45,"s":[{"i":[[0.013,0.002],[0.02,-0.074],[-0.008,-0.026],[-0.022,0.005],[0.002,0.1],[0.01,0.019]],"o":[[-0.051,0.043],[-0.025,0.092],[0.006,0.046],[0.022,-0.005],[-0.003,-0.013],[-0.007,-0.014]],"v":[[-122.856,-13.795],[-122.961,-13.602],[-122.982,-13.394],[-122.896,-13.33],[-122.807,-13.709],[-122.825,-13.767]],"c":true}]},{"i":{"x":0.833,"y":0.833},"o":{"x":0.167,"y":0.167},"t":46,"s":[{"i":[[-0.765,-0.062],[-0.931,3.357],[0.21,2.636],[1.578,-0.962],[-3.421,-12.026],[-0.685,-0.347]],"o":[[1.49,-3.209],[1.152,-4.156],[-0.38,-4.766],[-1.578,0.962],[0.214,0.752],[0.492,0.249]],"v":[[-122.607,31.222],[-118.901,21.118],[-117.349,10.447],[-122.877,11.932],[-125.818,29.122],[-124.486,30.759]],"c":true}]},

Using 7-Zip ultra settings and paq8p on this .json file, we get the following compression results:

215.030 7512-blue-heart.json
 21.522 7512-blue-heart.json.zip
 21.387 7512-blue-heart.json.gz
 18.850 7512-blue-heart.json.bz2
 12.501 7512-blue-heart.json.7z
  9.503 7512-blue-heart.json.paq8p.3

I guess some custom binary format would be even better than GZip, but they just chose something that is already available and fulfills the decompression speed/memory requirement. And perhaps they just didn't consider LZMA(2) or it just works well on this specific file.

[WinnieW]

PAQ is not the most sensible choice for that use case. Brotli is probably an even better choice compared to 7-zip.

11.522 7512-blue-heart.json.br (Brotli default settings)

[schnaader]

PAQ is not the most sensible choice for that use case. Brotli is probably an even better choice compared to 7-zip.

Yes, paq8p was only used to provide kind of a lower limit, it's much too slow of course. Nice to see that brotli performs well here.

The .tgs format is indeed gZipped Lottie, here's a GitLab repository that has some reverse engineering results and Python scripts. The lottie2tgs script is basically a gZip invocation. The repository also contains a Synfig studio (open source 2D animation software) plugin so Adobe After Effects is not a requirement anymore (though I haven't tried if it works like it should).

[WinnieW]

I asked myself why Telegram picked the old deflate method instead of a modern algorithm, like Brotli.