---
title: "React Native Skia: A Year in Review and a Look Ahead"
description: "React Native Skia’s first year produced an initial alpha and 89 additional releases, evolving a React Renderer and Skia integration for declarative 2D graphics across iOS, Android, the Web, and Node.js testing. The project changed direction after identifying two bottlenecks: dependence on the JavaScript thread and the overhead of thousands of JSI allocations in large drawings. Skia DOM addresses them with a declarative drawing state that recomputes only necessary changes and executes drawings on the UI thread, with C++ implementations on iOS and Android and a JavaScript implementation on React Native Web. CanvasKit compatibility, Expo integration, Metal on iOS, and OpenGL on Android and the Web support the cross-platform design, while extension points enable modules such as Skottie and camera-frame effects. The library’s tests compare rendered examples across platforms, and planned work includes JavaScript-worklet and Reanimated animation integration plus advanced text layouts through Skia’s paragraph module."
---

# React Native Skia: A Year in Review and a Look Ahead

[Shopify](https://yomu.fyi/company/shopify) · 2023-10-18 · Dec 29, 2022

**Type:** Explainer

## Summary

React Native Skia’s first year produced an initial alpha and 89 additional releases, evolving a React Renderer and Skia integration for declarative 2D graphics across iOS, Android, the Web, and Node.js testing. The project changed direction after identifying two bottlenecks: dependence on the JavaScript thread and the overhead of thousands of JSI allocations in large drawings. Skia DOM addresses them with a declarative drawing state that recomputes only necessary changes and executes drawings on the UI thread, with C++ implementations on iOS and Android and a JavaScript implementation on React Native Web. CanvasKit compatibility, Expo integration, Metal on iOS, and OpenGL on Android and the Web support the cross-platform design, while extension points enable modules such as Skottie and camera-frame effects. The library’s tests compare rendered examples across platforms, and planned work includes JavaScript-worklet and Reanimated animation integration plus advanced text layouts through Skia’s paragraph module.

## Context

The initial alpha release depended partly on the JavaScript thread to collect drawing commands and incurred many JSI object allocations and invocations for drawings containing thousands of components. These bottlenecks delayed first canvas frames, particularly during transitions with many canvases, and caused noticeable overhead on low-end devices.

## Approach / What changed

The project introduced Skia DOM, a platform- and framework-agnostic declarative representation of Skia drawings. It maintains the drawing as a source of truth, recomputes only necessary state after updates, and enables UI-thread rendering without depending on the JavaScript thread. The integration also uses CanvasKit-compatible APIs, Expo support, platform GPU APIs, extension points, and cross-platform end-to-end testing.

## Takeaways

- Skia DOM can receive updates from the JavaScript or animation thread while executing drawings independently on the UI thread.
- The renderer is decoupled from DOM and native APIs, allowing the same renderer across iOS, Android, and Web, with Node.js used for testing.
- End-to-end tests render examples on iOS, Android, and Web, then compare drawings for correctness and cross-platform consistency.

**Tags:** [Architecture](https://yomu.fyi/topic/architecture), [Open Source](https://yomu.fyi/topic/open-source), [Performance](https://yomu.fyi/topic/performance), [Testing](https://yomu.fyi/topic/testing), [TypeScript](https://yomu.fyi/topic/typescript)

- Source: [Shopify](https://shopify.engineering/react-native-skia-2022)
- Source URL: https://shopify.engineering/react-native-skia-2022
- Ingested by Yomu: 2026-08-30T13:36:35.666Z

[Read original post](https://shopify.engineering/react-native-skia-2022)