Disable rendering (to release graphics related memory) when EngineHook unmounts (#120)

Author: ryantrem

Modules/@babylonjs/react-native/BabylonModule.ts

@@ -3,25 +3,27 @@ import { NativeEngine } from '@babylonjs/core';
 
 // This global object is part of Babylon Native.
 declare const _native: {
-    graphicsInitializationPromise: Promise<void>;
+    whenGraphicsReady: () => Promise<void>;
     engineInstance: NativeEngine;
 }
 
 const NativeBabylonModule: {
     initialize(): Promise<boolean>;
     whenInitialized(): Promise<boolean>;
+    reset(): Promise<boolean>;
 } = NativeModules.BabylonModule;
 
 export const BabylonModule = {
     initialize: async () => {
         const initialized = await NativeBabylonModule.initialize();
         if (initialized) {
-            await _native.graphicsInitializationPromise;
+            await _native.whenGraphicsReady();
         }
         return initialized;
     },
 
     whenInitialized: NativeBabylonModule.whenInitialized,
+    reset: NativeBabylonModule.reset,
 
     createEngine: () => {
         const engine = new NativeEngine();

Modules/@babylonjs/react-native/EngineHook.ts

@@ -83,6 +83,7 @@ export function useEngine(): Engine | undefined {
             if (engine) {
                 DisposeEngine(engine);
             }
+            BabylonModule.reset();
             setEngine(undefined);
         };
     }, []);

Modules/@babylonjs/react-native/android/src/main/cpp/BabylonNativeInterop.cpp

@@ -85,6 +85,12 @@ namespace Babylon
             auto height = static_cast<size_t>(ANativeWindow_getHeight(windowPtr));
             m_graphics->UpdateWindow<void*>(windowPtr);
             m_graphics->UpdateSize(width, height);
+            m_graphics->EnableRendering();
+        }
+
+        void Reset()
+        {
+            m_graphics->DisableRendering();
         }
 
         void SetPointerButtonState(uint32_t pointerId, uint32_t buttonId, bool isDown, uint32_t x, uint32_t y)
@@ -166,6 +172,12 @@ extern "C" JNIEXPORT void JNICALL Java_com_babylonreactnative_BabylonNativeInter
     native->SetPointerPosition(static_cast<uint32_t>(pointerId), static_cast<uint32_t>(x), static_cast<uint32_t>(y));
 }
 
+extern "C" JNIEXPORT void JNICALL Java_com_babylonreactnative_BabylonNativeInterop_reset(JNIEnv* env, jclass obj, jlong instanceRef)
+{
+    auto native = reinterpret_cast<Babylon::Native*>(instanceRef);
+    native->Reset();
+}
+
 extern "C" JNIEXPORT void JNICALL Java_com_babylonreactnative_BabylonNativeInterop_destroy(JNIEnv* env, jclass obj, jlong instanceRef)
 {
     auto native = reinterpret_cast<Babylon::Native*>(instanceRef);

Modules/@babylonjs/react-native/android/src/main/java/com/babylonreactnative/BabylonModule.java

@@ -39,4 +39,12 @@ public void initialize(Promise promise) {
     public void whenInitialized(Promise promise) {
         BabylonNativeInterop.whenInitialized(this.getReactApplicationContext()).thenAccept(instanceRef -> promise.resolve(instanceRef != 0));
     }
+
+    @ReactMethod
+    public void reset(Promise promise) {
+        this.getReactApplicationContext().runOnJSQueueThread(() -> {
+            BabylonNativeInterop.reset(this.getReactApplicationContext());
+            promise.resolve(null);
+        });
+    }
 }

Modules/@babylonjs/react-native/android/src/main/java/com/babylonreactnative/BabylonNativeInterop.java

@@ -35,6 +35,7 @@ final class BabylonNativeInterop {
     private static native void refresh(long instanceRef, Surface surface);
     private static native void setPointerButtonState(long instanceRef, int pointerId, int buttonId, boolean isDown, int x, int y);
     private static native void setPointerPosition(long instanceRef, int pointerId, int x, int y);
+    private static native void reset(long instanceRef);
     private static native void destroy(long instanceRef);
 
     // Must be called from the Android UI thread
@@ -137,6 +138,17 @@ static void deinitialize() {
         BabylonNativeInterop.destroyOldNativeInstances(null);
     }
 
+    static void reset(ReactContext reactContext) {
+        JavaScriptContextHolder jsContext = reactContext.getJavaScriptContextHolder();
+        CompletableFuture<Long> instanceRefFuture = BabylonNativeInterop.nativeInstances.get(jsContext);
+        if (instanceRefFuture != null) {
+            Long instanceRef = instanceRefFuture.getNow(null);
+            if (instanceRef != null) {
+                BabylonNativeInterop.reset(instanceRef);
+            }
+        }
+    }
+
     private static CompletableFuture<Long> getOrCreateFuture(ReactContext reactContext) {
         JavaScriptContextHolder jsContext = reactContext.getJavaScriptContextHolder();
         CompletableFuture<Long> instanceRefFuture = BabylonNativeInterop.nativeInstances.get(jsContext);

Modules/@babylonjs/react-native/ios/BabylonModule.mm

@@ -1,9 +1,14 @@
 #import "BabylonNativeInterop.h"
 
 #import <React/RCTBridgeModule.h>
+#import <ReactCommon/CallInvoker.h>
 
 #import <Foundation/Foundation.h>
 
+@interface RCTBridge (RCTTurboModule)
+- (std::shared_ptr<facebook::react::CallInvoker>)jsCallInvoker;
+@end
+
 @interface BabylonModule : NSObject <RCTBridgeModule>
 @end
 
@@ -21,4 +26,11 @@ @implementation BabylonModule
     [BabylonNativeInterop whenInitialized:self.bridge resolve:resolve];
 }
 
+RCT_EXPORT_METHOD(reset:(RCTPromiseResolveBlock)resolve reject:(RCTPromiseRejectBlock)reject) {
+    self.bridge.jsCallInvoker->invokeAsync([resolve]() {
+        [BabylonNativeInterop reset];
+        resolve([NSNull null]);
+    });
+}
+
 @end

Modules/@babylonjs/react-native/ios/BabylonNative.cpp

@@ -87,13 +87,19 @@ namespace Babylon
     {
         m_impl->graphics->UpdateWindow<void*>(windowPtr);
         m_impl->graphics->UpdateSize(width, height);
+        m_impl->graphics->EnableRendering();
     }
 
     void Native::Resize(size_t width, size_t height)
     {
         m_impl->graphics->UpdateSize(width, height);
     }
 
+    void Native::Reset()
+    {
+        m_impl->graphics->DisableRendering();
+    }
+
     void Native::SetPointerButtonState(uint32_t pointerId, uint32_t buttonId, bool isDown, uint32_t x, uint32_t y)
     {
         if (isDown)

Modules/@babylonjs/react-native/ios/BabylonNative.h

@@ -13,6 +13,7 @@ namespace Babylon
         ~Native();
         void Refresh(void* windowPtr, size_t width, size_t height);
         void Resize(size_t width, size_t height);
+        void Reset();
         void SetPointerButtonState(uint32_t pointerId, uint32_t buttonId, bool isDown, uint32_t x, uint32_t y);
         void SetPointerPosition(uint32_t pointerId, uint32_t x, uint32_t y);
 

Modules/@babylonjs/react-native/ios/BabylonNativeInterop.h

@@ -7,4 +7,5 @@
 + (void)setView:(RCTBridge*)bridge jsRunLoop:(NSRunLoop*)jsRunLoop mktView:(MTKView*)mtkView;
 + (void)reportTouchEvent:(NSSet<UITouch*>*)touches withEvent:(UIEvent*)event;
 + (void)whenInitialized:(RCTBridge*)bridge resolve:(RCTPromiseResolveBlock)resolve;
++ (void)reset;
 @end

Modules/@babylonjs/react-native/ios/BabylonNativeInterop.mm

@@ -115,6 +115,12 @@ + (void)whenInitialized:(RCTBridge*)bridge resolve:(RCTPromiseResolveBlock)resol
     }
 }
 
++ (void)reset {
+    if (currentNativeInstance) {
+        currentNativeInstance->Reset();
+    }
+}
+
 + (void)setCurrentView:(MTKView*)mtkView {
     currentView = mtkView;
     activeTouches = [NSMutableArray new];