Skip to content

Rive Renderer Causes Jank on Flutter Android and Missing Animations on Flutter Web When Loading Multiple Animations #638

@nikkieke

Description

@nikkieke

Submission checklist

  • I have confirmed the issue is present in the latest version of the rive Flutter package
  • I have searched the documentation and forums and could not find an answer
  • I have searched existing issues and this is not a duplicate

Description

When displaying multiple Rive animations on a single screen using Factory.rive as the renderer, two platform-specific issues occur:

Android: animations stutter and jank, with Flutter logging a warning that the app may be doing too much work on its main thread
Flutter Web: some animations fail to render entirely and show as blank widgets
Neither issue occurs with Factory.flutter. All renderers work correctly on iOS.

Environment
Rive dependency: ^0.14.6
Affected platforms: Android, Flutter Web
Unaffected platform: iOS

Reproduction steps / code

Trigger conditions

  • Multiple RiveWidget instances rendered simultaneously on a single screen (50+)
  • FileLoader initialized with Factory.rive

Results

  • Android: animations jank and stutter
  • Flutter Web: subset of widgets render blank - throws error: InvalidStateError: Failed to execute 'transferToImageBitmap' on 'OffscreenCanvas': Cannot transfer to ImageBitmap because WebGL context is lost.

Upload your reproduction files / stack trace

No response

Source .riv / .rev file

No response

Screenshots / video

No response

Rive Flutter package version

0.14.6

Flutter version

Flutter (Channel stable, 3.38.0)

Device

Pixel 7

OS version

Android (API 36)

Additional context

No response

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type
    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions