Skip to content

4.34.0

Choose a tag to compare

@github-actions github-actions released this 03 Sep 13:46
· 2 commits to main since this release

This release enables GPU Canvas content to work in React runtimes as an opt-in feature, specifically for the @rive-app/react-webgl2 runtime. It follows the JS runtime's 2.42.0 release, which introduces the foundation for a deferred rendering pattern for both Canvas2d and WebGL2. This will continue to be built upon in future releases to improve performance in the long run.

New

With GPU Canvas, you can opt-in at the useRiveFile level if constructing the file yourself, or at the useRive/<Rive /> level, both are valid, with some caveats to keep in mind.

useRiveFile

  • enableGPUCanvas: boolean — When passing parameters to useRiveFile, you can opt in to GPU Canvas with this flag set to true. After passing the resulting RiveFile to the riveFile parameter on useRive, it will draw GPU Canvas content.

useRive / <Rive />

  • enableGPUCanvas: boolean — When creating a Rive instance through the useRive hook or the <Rive /> component, opt in to render GPU Canvas content with this flag set to true. Note that if you pass in riveFile (as opposed to src or buffer), the Rive instance will respect the rendering mode the riveFile was set up with as source of truth.

useOffscreenRenderer default

The React runtime currently defaults useOffscreenRenderer to true, so that instancing multiple Rive graphics on a page would lessen the chance of running into WebGL context limits that browsers impose. Opting in to enableGPUCanvas now changes that React-side default to false.

If you set useOffscreenRenderer to any value, the runtime will respect that and will not draw GPU Canvas content if set to true, even if you opt in with enableGPUCanvas. We recommend either leaving useOffscreenRenderer unset or to false when you want to draw GPU canvas content.

More docs to come and will be linked here soon!

Commits

  • feature: add enableGPUCanvas param to allow GPU Canvas content to render for WebGL2 React variant 03d8cbb
  • docs comment touchups 76bc972