TL;DR: React Native is finally gaining a GPU-native, web-aligned graphics stack with WebGPU and Skia Graphite. This is the culmination of years of work they've been doing for rendering, animation, 3D, and compute on the platform.

---

Here's the video from the launch event.

Switzerland is the place to be I guess...

On May 6th, the Shopify team - behind React Native Skia - revealed the early pieces of a new era for React Native.

For context, RNSkia is one of the most critical libraries in the React Native ecosystem. In the name, it brings the Skia graphics engine to React Native - something that's prior to it, forced developers to use anicent webviews and WebGL to render any non-trivial graphics.

What's new?

Well nothing, really. But everything is improved. Especially performance.

• React Native WebGPU — bringing the next-gen web standard to mobile, using Dawn.
• React Native Skia — made leaner, faster, and future-proof, now ready to support Skia Graphite.

If you've ever struggled with janky animations (let's be real, most of us have - I know I do), UI-thread blocking, or unmaintainable workarounds just to render something cool in React Native, this update is for you.

---

React Native WebGPU

WebGPU is the modern graphics and compute API designed to supersede WebGL. It's faster, safer, more ergonomic, and already backed by Apple, Google, and Mozilla. React Native is now the latest platform to support it.

Core perks

• 100% spec-compatible with the web.
• Full Canvas API parity.
• Deep integration with Reanimated for gesture control, shared element transitions, and blocking-safe animations.
• Works on iOS, Android, macOS, and Vision Pro.
• Enables compute shaders, unlocking general-purpose GPU tasks (not just graphics).

Why it's a big deal

Historically in React Native, we had to rely on:

• react-native-svg or ART for basic drawing.
• react-native-webgl for hacky 3D.
• GLView hacks from Expo + custom native shaders.
• And always, main thread JS binding pain (bridging + perf).

If you don't know what WebGPU is, it's modern, multi-threaded, and designed for async rendering. With Reanimated and worklets, we can now animate complex 3D scenes without touching the JS thread.

---

Typed WebGPU

The Software Mansion team also introduced TypeGPU — a bridge between TypeScript and WGSL, WebGPU's shading language.

What it enables

• Use typed GPU buffers from JS.
• Generate matching WGSL shaders from our TypeScript definitions.
• Avoid low-level buffer alignment issues.
• Works incrementally—we can TypeGPU-ify only parts of our app.

This is the kind of DX we dreamed of during the WebGL era, but never got.

---

Compute Shaders on React Native

The compute shaders now run natively on React Native through WebGPU.

Examples include:

• compute.toys — an open-source compute demo engine that now runs out of the box.
• TensorFlow.js — GPU-backed inference in a mobile React Native app.
• Custom physics or gravity simulations running fully in parallel on the GPU.

Previously, we'd have to use WebAssembly, native modules, or ship pre-trained models to servers.

Now? Just run it on device, on GPU, in parallel. An ode to local-first? I think so.

Aside

It's a joy to see companies start this shift back to local-first models, where on-device compute is king. I'm super excited to see this trend continue, and hopefully be here to stay.

---

The cost of FFI (Foreign Function Interface)

Here's where the magic really happens.

Traditionally in React Native:

• Every native draw call → bridge crossing
• Animating 1000+ objects → either drop frames or batch on native side (if lucky)
• Shit, even JSI allocations (creating objects per frame) became a bottleneck

WebGPU solves this with:

• Instancing, which allows one draw call to render many objects
• Render bundles, which pre-record scenes and render with a single call
• Compute shaders, which run logic on GPU without bouncing back to JS

CUDA developers are probably laughing at me rejoice so hard over this. But I don't even care. I know web development is a little behind here, but it's still a big deal. And for RN devs - a world we've been dreaming of for years.

---

Three.js & R3F (React Three Fiber)

React Native WebGPU can now run Three.js with:

• A WebGPU backend.
• Support for TSL (TypeScript Shading Language).
• A custom Metro bundler plugin to make it worklet-compatible.

Their team in the launch event also showcasd some real world use-cases of R3F running on React Native WebGPU. They showcased a 3D Black Friday globe, and a map of Starlink satellites.

Both of which are running on React Native WebGPU - already migrated.

Before this? You'd:

• Render in Unity and embed a native view.
• Use expo-three hacks + GLView.
• Get jank, crashes, or no cross-platform support.

Now? It just works. Smoothly. Natively. On GPU. What a time to be alive.

---

Performance > Features

And they weren't kidding

These aren't incremental. They're generational. This is Skia getting out of its own way.

Skia now supports:

• Immutable display lists.
• Direct integration with Reanimated values (no JS <-> native bouncing).
• Worklet-driven execution, zero GC pressure.
• Graphite backend toggle (coming soon).

---

API Improvements

Before: OpenGL (Android) and Metal (iOS) → separate, buggy backends.

Now: Unified abstraction → ready for WebGPU (Graphite).

Declarative API

• Before: Mutable "SkiaDOM" + manual thread scheduling.
• Now: Immutable Fabric reconciler, fully thread-safe with zero concurrency cost.

Platform API

• Skia now runs on:
  • iOS
  • Android
  • macOS
  • tvOS
  • Node.js

And even powers video rendering for Open Graph previews, thanks to swsh and Azapp.

---

In the wild

These use cases weren't possible before. Not without huge native modules or web views. Skia just made them feasible and elegant.

---

Skia graphite (experimental)

Graphite is Skia's new backend for modern GPU APIs (Vulkan, Metal, WebGPU).

---

We've seen this before

React Native is now mirroring Chrome's approach:

• WebGPU for low-level 2D/3D compute
• Skia for high-level primitives, UI rendering, and declarative composition

The real game changer

Composition. You can use Skia drawings inside WebGPU textures and vice versa.

This is the dream. A seamless, fast, cross-platform, declarative graphics stack. No hacks. No bridges. Just beautiful pixels, and cross-platform composability like what React pioneered back in the day.

---

The future

The community's not done. With even just the stuff we talked about - Nitro modules, Reanimated worklets, and TypeGPU-style APIs, the ecosystem is evolving in real time.

---

Until next time y'all, happy hacking.