[IOS] Crash due to unexpected dispose

[Corelli-18512]

I am using rnskia for a game app which requires frequent image drawing and disposing. Occasionally (10 min of playing on avg) I will get a crash looks like this:

I cannot steadily reproduce this so it is really tricky to find out the root cause, but it is definitely caused by unexpected GC. Any help on debugging this or any workaround will be appreciated!

[Corelli-18512]

more stacktraces

[wcandillon]

.dispose() is a noop on v2.2.13 so it should be solved. But please let me know if this is not the case and I will reopen it.

[Corelli-18512]

.dispose() is a noop on v2.2.13 so it should be solved. But please let me know if this is not the case and I will reopen it.

I have been using 2.2.13 but the issue remains.

{
        "@shopify/react-native-skia": "2.2.13",
        "react": "19.0.0",
        "react-native": "0.79.5",
        "react-native-reanimated": "^3.19.1",
}

Only that the issue seems to happen more frequently than 2.0.5 I was using :(

I tried to use signal to mitigate like:

But it causes memory leak and makes the app been killed OOM at the end. It is not a good practice anyway so I really want to find the root cause

[Corelli-18512]

@wcandillon The issue is on hade thread so a wild guess is when GC wants to dispose an image with no ref, the image has already been disposed manually from JS side. But I don't know how to verify or debug this.
And this looks really weird to me that it seems like this is still accessible when the issue happens, even this->getRefCnt() is accessible when I tried to add a line just before, but internal_dispose() throws error.

[wcandillon]

@Corelli-18512 you're mentioning "the image has already been disposed manually from JS side" but that's not something possible anymore, can you provide a reproduction?

[Corelli-18512]

@Corelli-18512 you're mentioning "the image has already been disposed manually from JS side" but that's not something possible anymore, can you provide a reproduction?

@wcandillon Oh so dispose() on JS side is not doing anything now and I can remove it from my codes? I am using it this way like before:

const image = useSharedValue<SkImage | null>(null);
image.value = surface.makeImageSnapshot();
// ...after making some changes to the surface
image.value?.dispose();
const image = surface.makeImageSnapshot();

It is however tricky to reproduce the issue I met because it's very random. Let me try to make a minimal project and get back to you.

[wcandillon]

correct but it is still needed on RN Web.

…

On Fri, Sep 12, 2025 at 12:32 PM Corelli-18512 ***@***.***> wrote: @Corelli-18512 you're mentioning "the image has already been disposed manually from JS side" but that's not something possible anymore, can you provide a reproduction? @wcandillon Oh so dispose() on JS side is not doing anything now and I can remove it from my codes? I am using it this way like before: const image = useSharedValue<SkImage | null>(null); image.value = surface.makeImageSnapshot(); // ...after making some changes to the surface image.value?.dispose(); const image = surface.makeImageSnapshot(); It is however tricky to reproduce the issue I met because it's very random. Let me try to make a minimal project and get back to you. — Reply to this email directly, view it on GitHub or unsubscribe. You are receiving this email because you were mentioned. Triage notifications on the go with GitHub Mobile for iOS or Android.

[Corelli-18512]

@wcandillon I made a reproducible example:

import { Alert, Button, PixelRatio, SafeAreaView, StyleSheet } from 'react-native';

import { Canvas, Image, Skia, SkImage, SkSurface } from '@shopify/react-native-skia';
import {
    runOnUI,
    useSharedValue,
    withTiming
} from 'react-native-reanimated';

export default function App() {
    const image = useSharedValue<SkImage | null>(null);
    const surface = useSharedValue<SkSurface | null>(null);
    const looper = useSharedValue(0);
    const pixelRatio = PixelRatio.get();

    const start = () => {
        'worklet';
        surface.value = Skia.Surface.MakeOffscreen(
            pixelRatio * 200,
            pixelRatio * 200
        );
        const blink = () => {
            if (!surface.value) {
                Alert.alert('surface is null');
                return;
            }
            const canvas = surface.value.getCanvas();
            const paint = Skia.Paint();
            paint.setColor(
                Float32Array.from([
                    Math.random(),
                    Math.random(),
                    Math.random(),
                    1,
                ])
            );
            canvas.drawRect(
                {
                    x: 0,
                    y: 0,
                    width: pixelRatio * 200,
                    height: pixelRatio * 200,
                },
                paint
            );
            surface.value.flush();
            image.value = surface.value.makeImageSnapshot();
            looper.value = withTiming(
                1 - looper.value,
                { duration: 10 },
                blink
            );
        };
        blink();
    };

    return (
        <SafeAreaView style={styles.container}>
            <Canvas
                style={{
                    width: 200,
                    height: 200,
                    borderColor: 'red',
                    borderWidth: 1,
                }}
            >
                <Image image={image} width={200} height={200} />
            </Canvas>
            <Button onPress={runOnUI(start)} title="Start" />
        </SafeAreaView>
    );
}

const styles = StyleSheet.create({
    container: {
        flex: 1,
        justifyContent: 'center',
        alignItems: 'center',
        backgroundColor: '#ecf0f1',
        padding: 8,
    },
});

Wait the blinking for a period of time (seems random to me and may take up to several minutes). You may see the internal_dispose error.
I know this might be an overly stressful test but similar burst of rendering does happen in real life usage :(

[wcandillon]

no no I like it. We ran some insane stress test on RN Skia, so if you found one we missed, we love it.

…

On Sat, Sep 13, 2025 at 10:22 AM Corelli-18512 ***@***.***> wrote: @wcandillon I made a reproducible example: import { Alert, Button, PixelRatio, SafeAreaView, StyleSheet } from 'react-native'; import { Canvas, Image, Skia, SkImage, SkSurface } from ***@***.***/react-native-skia'; import { runOnUI, useSharedValue, withTiming } from 'react-native-reanimated'; export default function App() { const image = useSharedValue<SkImage | null>(null); const surface = useSharedValue<SkSurface | null>(null); const looper = useSharedValue(0); const pixelRatio = PixelRatio.get(); const start = () => { 'worklet'; surface.value = Skia.Surface.MakeOffscreen( pixelRatio * 200, pixelRatio * 200 ); const blink = () => { if (!surface.value) { Alert.alert('surface is null'); return; } const canvas = surface.value.getCanvas(); const paint = Skia.Paint(); paint.setColor( Float32Array.from([ Math.random(), Math.random(), Math.random(), 1, ]) ); canvas.drawRect( { x: 0, y: 0, width: pixelRatio * 200, height: pixelRatio * 200, }, paint ); surface.value.flush(); image.value = surface.value.makeImageSnapshot(); looper.value = withTiming( 1 - looper.value, { duration: 10 }, blink ); }; blink(); }; return ( <SafeAreaView style={styles.container}> <Canvas style={{ width: 200, height: 200, borderColor: 'red', borderWidth: 1, }} > <Image image={image} width={200} height={200} /> </Canvas> <Button onPress={runOnUI(start)} title="Start" /> </SafeAreaView> ); } const styles = StyleSheet.create({ container: { flex: 1, justifyContent: 'center', alignItems: 'center', backgroundColor: '#ecf0f1', padding: 8, }, }); Wait the blinking for a period of time (seems random to me and may take up to several minutes). You may see the internal_dispose error. I know this might be an overly stressful test but similar burst of rendering does happen in real life usage :( — Reply to this email directly, view it on GitHub or unsubscribe. You are receiving this email because you were mentioned. Triage notifications on the go with GitHub Mobile for iOS or Android.

[wcandillon]

@Corelli-18512 thank you for the nice reproducible example, this looks very interesting, currently investing it

[Corelli-18512]

@Corelli-18512 thank you for the nice reproducible example, this looks very interesting, currently investing it

I would be really happy if this can help! Everything else about the new memory management works as charm and really saves me a lot of worry on memory thresholds.

[wcandillon]

@Corelli-18512 This had peaked my attention quite a bit. I found the root cause of the issue 😳 sometimes (not always) the garbage collector runs on a different thread. At the very moment, it does, it will crash (as expected):

[DEBUG] JsiSkSurface::getCanvas - Thread ID: 0x100240200
[DEBUG] JsiSkSurface::makeImageSnapshot - Thread ID: 0x100240200
[DEBUG] JsiSkImage::~JsiSkImage - Thread ID: 0x100240200
[DEBUG] JsiSkImage::makeNonTextureImage - Thread ID: 0x100240200
[DEBUG] JsiSkImage::~JsiSkImage - Thread ID: 0x170737000 <=== 💣💥

Thank you for helping us uncover this.

Will report back with more information soon.