Загрузка видео...
Не удалось загрузить видео
Let's take a look at the performance of Rive animations using different renderers. All running on Flutter, release mode. Skia: 9 tiles ~100ms (10fps) Impeller: 9 tiles ~100ms (10fps) Rive Renderer: 100 tiles ~16ms (60fps) See this thread for info.
92,590 просмотров • 3 лет назад •via X (Twitter)
Комментарии: 12

Tested on an iPhone 12 max. In the graphs, take note of the Raster thread for Skia and Impeller. This indicates the work done by those renderers. The UI thread is where the Rive Flutter runtime advances the animations and constructs the layer tree to send to the raster thread.

For the Rive Renderer example, all of the work to drive, construct, and render the animations all happen on the UI thread. Note that in the Skia/Impeller example the UI thread remains under 8ms. While the Raster thread eventually pushes over 100ms.

Drawing two of these tiles will already push Skia/Impeller over 16ms per frame - meaning it misses the target of 60fps. The Rive Renderer is able to do 36 tiles at around 5ms per frame (over 120fps) I eventually crank it up and render 100 tiles, still under 16ms per frame.

There is a benefit to using the Rive GameKit to advance the animations. That is why the UI thread is more expensive in the Skia/Impeller example compared to the Rive Renderer (which uses the Rive GameKit). But this is a less significant difference than the Raster thread result.

We can take a look at another example, running on macOS (M1 Max). Left: Skia Right: Rive Renderer Here Skia is able to render the demo scene (9 tiles) under 16ms (total Raster + UI) Rive Render can do 256 tiles under 16ms.

Take note in the beginning of the video the spikes in the Raster thread when new tiles pop in for the Skia example. This is one of the main issues that the Flutter team is trying to solve with Impeller: reducing shader compilation jank the first time an animation occurs.

You can also see that jank in the Rive Renderer example, when I open the menu for the first time. The menu is normal Flutter UI, and makes use of Skia.

What does all the above mean? Well this isn't meant to benchmark Skia vs Impeller. But from these results it's clear that the Rive renderer is really fast at drawing Rive animations and vector graphics. It'll enable you to create experiences not possible with other renderers.

You can learn more about the Rive Renderer here:

And more about the Rive GameKit here:

Eventually the Rive Renderer will run on more platforms. But you can find out why we chose Flutter as our first target (Rive GameKit).

You can also dive into how we made the game in the performance example:
