Hi, I was recently investigating whether compose d...

# compose-desktop

[yeungkc]

Hi, I was recently investigating whether compose desktop meets the company’s needs, and one of the goals was to support GIF and animation performance.

However, I found that compose desktop does not provide GIF support, and I found two code snippets in the related issue[0], but the performance difference between them is huge.

The first one [1], written by @Dominaezzz, is very easy to understand and intuitive, but the CPU usage hovers around 100%.
The second one [2], written by @olonho, is a bit more complex, but has better performance, with a CPU usage of around 25%.

But I would say that either solution is not really acceptable. And I would like to know how we should write high performance animations?

I actually tried to use java swing ImageIcon and it hardly uses any CPU usage.

I believe compose desktop should be able to do the same, but how should I do it?

[0]: https://github.com/JetBrains/compose-jb/issues/153
[1]: https://github.com/JetBrains/compose-jb/issues/153#issuecomment-864608382
[2]: https://github.com/JetBrains/compose-jb/issues/153#issuecomment-822439430

[Dominaezzz]

I've got two code snippets in the issue, which one are you referring to?

[yeungkc]

@Dominaezzz
I was referring to https://github.com/JetBrains/compose-jb/issues/153#issuecomment-864608382

In fact, two snippets have close performance.

[Dominaezzz]

Ah, I can tell you why it's bad and how it can be improved.

[Dominaezzz]

The call to readPixels is kinda expensive and is called every time the image changes.

[Igor Demin]

with a CPU usage of around 25%.

We update animation on every vsync signal. withFrameNanos ticks every 16.7ms on 60hz monitor, and we also have an issue on some Linux machines where vsync is disabled - frames produced as fast as possible.

So one of the steps to optimize it - is to reduce animation updates (gif animations can have a slower rate, for example every 50ms).

Also, not sure, but maybe codec.readPixels is too heavy. Worth to try to cache frames, and see how it helps.

Also after caching, it is worth to call bitmap.setImmutable(). That can significally increase performance, as Bitmap can be uploaded to GPU memory only once.

[yeungkc]

@Dominaezzz Regarding readPixels, I have tried caching all the bitmaps and there is no performance improvement

[Dominaezzz]

To make it better, you have to create several images and call readPixels once for each image. This caching should give you a major improvement. My (now closed) PR should do this.

[Dominaezzz]

Ah rip

[yeungkc]

I use

https://jackrusher.com/images/journal/what-does-it-mean-to-buy-a-gif/nyan-cat.gif▾

for GIF test.

@olonho @Dominaezzz
I think with such a large performance gap, the bitmap optimization might help, and in the code snippet in the issue, neither one performs the bitmap optimization.

In fact, I suspect it’s the animation internals that are causing this. It would be simpler to use withFrameNanos.

[yeungkc]

At this moment slack is playing the gif, but the CPU usage is almost unchanged. Just like using java swing’s ImageIcon.

[Dominaezzz]

Which platform are you on?

[yeungkc]

I’m using macOS

[yeungkc]

The second one [2], written by @olonho, is a bit more complex, but has better performance, with a CPU usage of around 25%.

I would like to correct that after I run it for a while, the CPU usage reaches about 10%

[yeungkc]

@Dominaezzz @olonho

After I tested it, I found that it was caused by animation, I opened a new issue:
https://github.com/JetBrains/compose-jb/issues/1054