Answers to Your Skia + React Native New Architecture Questions #

Let's break down each of your questions and share actionable fixes for the performance headaches you're dealing with:

1. Is there a Skia version that runs stably on React Native 0.81.2+ without enabling the New Architecture?

Unfortunately, no—starting with Skia v2.0, Shopify fully shifted to supporting only the React Native New Architecture (Fabric + TurboModules). If you need to run Skia on the old architecture, you’ll have to:

• Downgrade Skia to its last v1.x release (e.g., v1.2.3), and
• Downgrade React Native to 0.79.x or older (RN 0.80+ has breaking changes that aren’t compatible with Skia v1.x).

Note that Skia v1.x is no longer actively maintained, so you’ll miss out on new features and bug fixes going forward.

2. Recommended Skia + React Native version combinations with good build performance?

If you want to stick with the New Architecture:

• Stable, optimized combo: React Native 0.80.x / 0.81.x + Skia v2.4.0+
  • To cut build times and disk usage, trim your Android build config to only target architectures you actually need (e.g., remove armeabi-v7a and x86 if you don’t support older devices or legacy emulators).

If build speed is your top priority and you can live without New Architecture features:

• Old Architecture combo: React Native 0.79.x + Skia v1.2.3
  • This avoids all the New Architecture compilation overhead, drastically reducing build times and keeping your project size small.

3. Does the official documentation clarify if Skia depends on Fabric/TurboModules for newer React Native versions?

Absolutely. The official Shopify React Native Skia docs explicitly state that Skia v2.0 and above require the React Native New Architecture (Fabric and TurboModules). The old architecture is no longer supported in v2.x releases, which explains the blank screens or runtime errors you see when setting newArchEnabled=false.

Bonus Fixes for Your Current Performance Issues #

Since you’re already on the New Architecture stack, try these tweaks to reduce build times, disk bloat, and runtime lag:

• Trim supported architectures: Edit your android/app/build.gradle to only include arm64-v8a (for production) and x86_64 (for modern emulators). Removing unused architectures cuts down on compiled binaries and disk space.
• Enable Gradle caching: Add these lines to your android/gradle.properties:

  org.gradle.caching=true
  org.gradle.parallel=true
  org.gradle.configureondemand=true
  

  This reuses previous build artifacts and speeds up incremental builds.
• Clean Skia build caches: If you’re seeing unexpected slowdowns, delete the node_modules/@shopify/react-native-skia/android/build directory and re-run your build—this forces a fresh download of Skia’s prebuilt binaries.
• Optimize Hermes for dev: Ensure Hermes is enabled (you already have this) and consider disabling debug logging in your dev build to reduce runtime overhead.

Your Environment & Install Context #

For reference, here’s the setup that informed these answers:

• React Native version: 0.81.2
• Skia version: 2.4.14
• Enabled Hermes, targeting all 4 Android architectures on Windows 10 64-bit
• Fresh project install of Skia took 8 minutes via npm i @shopify/react-native-skia

Your package.json content:

{
  "name": "ArchTest",
  "version": "0.0.1",
  "private": true,
  "scripts": {
    "android": "react-native run-android",
    "ios": "react-native run-ios",
    "lint": "eslint .",
    "start": "react-native start",
    "test": "jest"
  },
  "dependencies": {
    "@react-native/new-app-screen": "0.81.2",
    "@shopify/react-native-skia": "^2.4.14",
    "react": "19.1.0",
    "react-native": "0.81.2",
    "react-native-safe-area-context": "^5.5.2"
  },
  "devDependencies": {
    "@babel/core": "^7.25.2",
    "@babel/preset-env": "^7.25.3",
    "@babel/runtime": "^7.25.0",
    "@react-native-community/cli": "20.0.0",
    "@react-native-community/cli-platform-android": "20.0.0",
    "@react-native-community/cli-platform-ios": "20.0.0",
    "@react-native/babel-preset": "0.81.2",
    "@react-native/eslint-config": "0.81.2",
    "@react-native/metro-config": "0.81.2",
    "@react-native/typescript-config": "0.81.2",
    "@types/jest": "^29.5.13",
    "@types/react": "^19.1.0",
    "@types/react-test-renderer": "^19.1.0",
    "eslint": "^8.19.0",
    "jest": "^29.6.3",
    "prettier": "2.8.8",
    "react-test-renderer": "19.1.0",
    "typescript": "^5.8.3"
  },
  "engines": {
    "node": ">=20"
  }
}

内容的提问来源于stack exchange，提问作者Ali Khattak