Skip to content

Commit

Permalink
Merge branch 'main' into wcandillon-patch-8
Browse files Browse the repository at this point in the history
  • Loading branch information
wcandillon authored Oct 17, 2024
2 parents 73219cd + 0ced902 commit 01ca045
Show file tree
Hide file tree
Showing 26 changed files with 221 additions and 337 deletions.
1 change: 1 addition & 0 deletions .gitignore
Original file line number Diff line number Diff line change
Expand Up @@ -69,6 +69,7 @@ packages/webgpu/cpp/dawn/
packages/webgpu/cpp/webgpu/
packages/webgpu/lib
!packages/webgpu/scripts/build
artifacts/


# Cocoapods
Expand Down
30 changes: 2 additions & 28 deletions apps/example/ios/Podfile.lock
Original file line number Diff line number Diff line change
Expand Up @@ -937,7 +937,7 @@ PODS:
- React-debug
- react-native-safe-area-context (4.11.0):
- React-Core
- react-native-wgpu (0.1.9):
- react-native-wgpu (0.1.11):
- DoubleConversion
- glog
- hermes-engine
Expand Down Expand Up @@ -1299,28 +1299,6 @@ PODS:
- ReactCommon/turbomodule/bridging
- ReactCommon/turbomodule/core
- Yoga
- RNScreens (3.34.0):
- DoubleConversion
- glog
- hermes-engine
- RCT-Folly (= 2024.01.01.00)
- RCTRequired
- RCTTypeSafety
- React-Codegen
- React-Core
- React-debug
- React-Fabric
- React-featureflags
- React-graphics
- React-ImageManager
- React-NativeModulesApple
- React-RCTFabric
- React-RCTImage
- React-rendererdebug
- React-utils
- ReactCommon/turbomodule/bridging
- ReactCommon/turbomodule/core
- Yoga
- SocketRocket (0.7.0)
- Yoga (0.0.0)

Expand Down Expand Up @@ -1387,7 +1365,6 @@ DEPENDENCIES:
- ReactTestApp-Resources (from `..`)
- RNGestureHandler (from `../../../node_modules/react-native-gesture-handler`)
- RNReanimated (from `../../../node_modules/react-native-reanimated`)
- RNScreens (from `../../../node_modules/react-native-screens`)
- Yoga (from `../../../node_modules/react-native/ReactCommon/yoga`)

SPEC REPOS:
Expand Down Expand Up @@ -1516,8 +1493,6 @@ EXTERNAL SOURCES:
:path: "../../../node_modules/react-native-gesture-handler"
RNReanimated:
:path: "../../../node_modules/react-native-reanimated"
RNScreens:
:path: "../../../node_modules/react-native-screens"
Yoga:
:path: "../../../node_modules/react-native/ReactCommon/yoga"

Expand Down Expand Up @@ -1553,7 +1528,7 @@ SPEC CHECKSUMS:
React-logger: 29fa3e048f5f67fe396bc08af7606426d9bd7b5d
React-Mapbuffer: bf56147c9775491e53122a94c423ac201417e326
react-native-safe-area-context: 851c62c48dce80ccaa5637b6aa5991a1bc36eca9
react-native-wgpu: e7e68e090306051c040faca3e53b0040641c954e
react-native-wgpu: f174e542dc510ff82b22709d8c1bec85b0f33d8f
React-nativeconfig: 9f223cd321823afdecf59ed00861ab2d69ee0fc1
React-NativeModulesApple: ff7efaff7098639db5631236cfd91d60abff04c0
React-perflogger: 32ed45d9cee02cf6639acae34251590dccd30994
Expand Down Expand Up @@ -1582,7 +1557,6 @@ SPEC CHECKSUMS:
ReactTestApp-Resources: 857244f3a23f2b3157b364fa06cf3e8866deff9c
RNGestureHandler: 67e78f16895947f7e57ab91e75e914d3e9ef7239
RNReanimated: 4c72fc2c0f4c6a9c36932e653cd68e4521b6c4ac
RNScreens: aa943ad421c3ced3ef5a47ede02b0cbfc43a012e
SocketRocket: abac6f5de4d4d62d24e11868d7a2f427e0ef940d
Yoga: ae3c32c514802d30f687a04a6a35b348506d411f

Expand Down
5 changes: 2 additions & 3 deletions apps/example/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -10,13 +10,13 @@
"start": "react-native start",
"pod:install": "pod install --project-directory=ios",
"build:android": "cd android && ./gradlew assembleDebug --warning-mode all",
"build:ios": "yarn run mkdist && react-native bundle --entry-file index.js --platform ios --dev true --bundle-output dist/main.ios.jsbundle --assets-dest dist && react-native build-ios --scheme Example --mode Debug --extra-params \"-sdk iphonesimulator CC=clang CPLUSPLUS=clang++ LD=clang LDPLUSPLUS=clang++ GCC_OPTIMIZATION_LEVEL=0 GCC_PRECOMPILE_PREFIX_HEADER=YES ASSETCATALOG_COMPILER_OPTIMIZATION=time DEBUG_INFORMATION_FORMAT=dwarf COMPILER_INDEX_STORE_ENABLE=NO\"",
"build:ios": "react-native build-ios --scheme Example --mode Debug --extra-params \"-sdk iphonesimulator CC=clang CPLUSPLUS=clang++ LD=clang LDPLUSPLUS=clang++ GCC_OPTIMIZATION_LEVEL=0 GCC_PRECOMPILE_PREFIX_HEADER=YES ASSETCATALOG_COMPILER_OPTIMIZATION=time DEBUG_INFORMATION_FORMAT=dwarf COMPILER_INDEX_STORE_ENABLE=NO\"",
"mkdist": "node -e \"require('node:fs').mkdirSync('dist', { recursive: true, mode: 0o755 })\""
},
"dependencies": {
"@callstack/react-native-visionos": "^0.74.0",
"@react-navigation/native": "^6.1.17",
"@react-navigation/native-stack": "^6.10.0",
"@react-navigation/stack": "^6.4.0",
"@react-three/fiber": "^8.17.6",
"fast-text-encoding": "^1.0.6",
"react": "18.2.0",
Expand All @@ -25,7 +25,6 @@
"react-native-macos": "^0.74.0",
"react-native-reanimated": "^3.12.1",
"react-native-safe-area-context": "^4.10.7",
"react-native-screens": "^3.32.0",
"react-native-wgpu": "*",
"teapot": "^1.0.0",
"three": "0.168.0",
Expand Down
4 changes: 2 additions & 2 deletions apps/example/src/App.tsx
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
import { NavigationContainer } from "@react-navigation/native";
import { createNativeStackNavigator } from "@react-navigation/native-stack";
import { createStackNavigator } from "@react-navigation/stack";
import { GestureHandlerRootView } from "react-native-gesture-handler";

import type { Routes } from "./Route";
Expand Down Expand Up @@ -32,7 +32,7 @@ import { CanvasAPI } from "./CanvasAPI";
import "fast-text-encoding";
window.parent = window;

const Stack = createNativeStackNavigator<Routes>();
const Stack = createStackNavigator<Routes>();

function App() {
const assets = useAssets();
Expand Down
4 changes: 2 additions & 2 deletions apps/example/src/Home.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@ import * as React from "react";
import { Platform, ScrollView, StyleSheet, Text, View } from "react-native";
import { useNavigation } from "@react-navigation/native";
import { RectButton } from "react-native-gesture-handler";
import type { NativeStackNavigationProp } from "@react-navigation/native-stack";
import type { StackNavigationProp } from "@react-navigation/stack";

import type { Routes } from "./Route";

Expand Down Expand Up @@ -116,7 +116,7 @@ const styles = StyleSheet.create({

export const Home = () => {
const { navigate } =
useNavigation<NativeStackNavigationProp<Routes, "Home">>();
useNavigation<StackNavigationProp<Routes, "Home">>();
return (
<ScrollView style={styles.container} contentContainerStyle={styles.content}>
{examples.map((thumbnail) => (
Expand Down
5 changes: 2 additions & 3 deletions apps/example/src/ThreeJS/List.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@ import * as React from "react";
import { ScrollView, StyleSheet, Text, View } from "react-native";
import { useNavigation } from "@react-navigation/native";
import { RectButton } from "react-native-gesture-handler";
import type { NativeStackNavigationProp } from "@react-navigation/native-stack";
import type { StackNavigationProp } from "@react-navigation/stack";

import type { Routes } from "./Routes";

Expand Down Expand Up @@ -43,8 +43,7 @@ const styles = StyleSheet.create({
});

export const List = () => {
const { navigate } =
useNavigation<NativeStackNavigationProp<Routes, "List">>();
const { navigate } = useNavigation<StackNavigationProp<Routes, "List">>();
return (
<ScrollView style={styles.container} contentContainerStyle={styles.content}>
{examples.map((thumbnail) => (
Expand Down
4 changes: 2 additions & 2 deletions apps/example/src/ThreeJS/index.tsx
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
import React, { useEffect } from "react";
import { createNativeStackNavigator } from "@react-navigation/native-stack";
import { createStackNavigator } from "@react-navigation/stack";
import { warnIfNotHardwareAccelerated } from "react-native-wgpu";

import { Cube } from "./Cube";
Expand All @@ -10,7 +10,7 @@ import { Backdrop } from "./Backdrop";
import { InstancedMesh } from "./InstancedMesh";
import { Fiber } from "./Fiber";

const Stack = createNativeStackNavigator<Routes>();
const Stack = createStackNavigator<Routes>();
export const ThreeJS = () => {
useEffect(() => {
navigator.gpu.requestAdapter().then((adapter) => {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -4,10 +4,10 @@

namespace rnwgpu {

class IOSPlatformContext : public PlatformContext {
class ApplePlatformContext : public PlatformContext {
public:
IOSPlatformContext() = default;
~IOSPlatformContext() = default;
ApplePlatformContext() = default;
~ApplePlatformContext() = default;

wgpu::Surface makeSurface(wgpu::Instance instance, void *surface, int width,
int height) override;
Expand All @@ -16,4 +16,4 @@ class IOSPlatformContext : public PlatformContext {
double size) override;
};

} // namespace rnwgpu
} // namespace rnwgpu
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
#include "IOSPlatformContext.h"
#include "ApplePlatformContext.h"

#import <React/RCTBlobManager.h>
#import <React/RCTBridge+Private.h>
Expand All @@ -9,7 +9,7 @@

namespace rnwgpu {

wgpu::Surface IOSPlatformContext::makeSurface(wgpu::Instance instance,
wgpu::Surface ApplePlatformContext::makeSurface(wgpu::Instance instance,
void *surface, int width,
int height) {
wgpu::SurfaceDescriptorFromMetalLayer metalSurfaceDesc;
Expand All @@ -19,7 +19,7 @@
return instance.CreateSurface(&surfaceDescriptor);
}

ImageData IOSPlatformContext::createImageBitmap(std::string blobId,
ImageData ApplePlatformContext::createImageBitmap(std::string blobId,
double offset, double size) {
RCTBlobManager *blobManager =
[[RCTBridge currentBridge] moduleForClass:RCTBlobManager.class];
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -7,4 +7,7 @@

@property NSNumber *contextId;

- (void)configure;
- (void)update;

@end
58 changes: 58 additions & 0 deletions packages/webgpu/apple/MetalView.mm
Original file line number Diff line number Diff line change
@@ -0,0 +1,58 @@
#import "MetalView.h"
#import "webgpu_cpp.h"

#ifndef RCT_NEW_ARCH_ENABLED
#import <React/RCTViewManager.h>
#endif //RCT_NEW_ARCH_ENABLED

@implementation MetalView {
BOOL _isConfigured;
}

+ (Class)layerClass {
return [CAMetalLayer class];
}

- (void)configure
{
auto size = self.frame.size;
std::shared_ptr<rnwgpu::RNWebGPUManager> manager = [WebGPUModule getManager];
void *nativeSurface = (__bridge void *)self.layer;
auto &registry = rnwgpu::SurfaceRegistry::getInstance();
auto gpu = manager->_gpu;
auto surface = manager->_platformContext->makeSurface(
gpu, nativeSurface, size.width, size.height);
registry.getSurfaceInfoOrCreate([_contextId intValue], gpu, size.width, size.height)
->switchToOnscreen(nativeSurface, surface);
}

- (void)update
{
auto size = self.frame.size;
auto &registry = rnwgpu::SurfaceRegistry::getInstance();
registry.getSurfaceInfo([_contextId intValue])->resize(size.width, size.height);
}

- (void)dealloc
{
auto &registry = rnwgpu::SurfaceRegistry::getInstance();
// Remove the surface info from the registry
registry.removeSurfaceInfo([_contextId intValue]);
}

#ifndef RCT_NEW_ARCH_ENABLED
// Paper only method
// TODO: this method is wrong, it appears to call configureSurface instead of
// updateSurface sometimes
- (void)reactSetFrame:(CGRect)frame {
[super reactSetFrame:frame];
if (!_isConfigured) {
[self configure];
_isConfigured = YES;
} else {
[self update];
}
}
#endif //RCT_NEW_ARCH_ENABLED

@end
File renamed without changes.
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
#import "WebGPUModule.h"
#import "GPUCanvasContext.h"
#include "IOSPlatformContext.h"
#include "ApplePlatformContext.h"

#import <React/RCTBridge+Private.h>
#import <React/RCTLog.h>
Expand Down Expand Up @@ -67,7 +67,7 @@ - (void)invalidate {
jsInvoker = cxxBridge.jsCallInvoker;
}
std::shared_ptr<rnwgpu::PlatformContext> platformContext =
std::make_shared<rnwgpu::IOSPlatformContext>();
std::make_shared<rnwgpu::ApplePlatformContext>();
// TODO: remove allocation here
webgpuManager = std::make_shared<rnwgpu::RNWebGPUManager>(runtime, jsInvoker,
platformContext);
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -8,9 +8,6 @@
NS_ASSUME_NONNULL_BEGIN

@interface WebGPUView : RCTViewComponentView
+ (void)registerMetalView:(MetalView *)metalView
withContextId:(NSNumber *)contextId;
+ (bool)isContextRegisterd:(NSNumber *)contextId;
@end

NS_ASSUME_NONNULL_END
Expand Down
69 changes: 69 additions & 0 deletions packages/webgpu/apple/WebGPUView.mm
Original file line number Diff line number Diff line change
@@ -0,0 +1,69 @@
#ifdef RCT_NEW_ARCH_ENABLED
#import "WebGPUView.h"

#import <react/renderer/components/RNWgpuViewSpec/EventEmitters.h>
#import <react/renderer/components/RNWgpuViewSpec/Props.h>
#import <react/renderer/components/RNWgpuViewSpec/RCTComponentViewHelpers.h>
#import <react/renderer/components/RNWgpuViewSpec/ComponentDescriptors.h>

#import "MetalView.h"
#import "RCTFabricComponentsPlugins.h"
#import "Utils.h"

using namespace facebook::react;

@implementation WebGPUView

+ (ComponentDescriptorProvider)componentDescriptorProvider {
return concreteComponentDescriptorProvider<WebGPUViewComponentDescriptor>();
}

- (void)prepareForRecycle {
[super prepareForRecycle];
/*
It's important to destroy the Metal Layer before releasing a view
to the recycled pool to prevent displaying outdated content from
the last usage in the new context.
*/
self.contentView = nil;
}

- (MetalView *)getContentView
{
if (!self.contentView) {
self.contentView = [MetalView new];
}
return (MetalView *)self.contentView;
}

- (void)updateProps:(const Props::Shared &)props
oldProps:(const Props::Shared &)oldProps {
const auto &oldViewProps =
*std::static_pointer_cast<const WebGPUViewProps>(_props);
const auto &newViewProps =
*std::static_pointer_cast<const WebGPUViewProps>(props);

if (newViewProps.contextId != oldViewProps.contextId) {
/*
The context is set only once during mounting the component
and never changes because it isn't available for users to modify.
*/
MetalView *metalView = [MetalView new];
self.contentView = metalView;
[metalView setContextId:@(newViewProps.contextId)];
[metalView configure];
}

[super updateProps:props oldProps:oldProps];
}

- (void)updateLayoutMetrics:(const LayoutMetrics &)layoutMetrics
oldLayoutMetrics:(const LayoutMetrics &)oldLayoutMetrics {
[super updateLayoutMetrics:layoutMetrics oldLayoutMetrics:oldLayoutMetrics];
[(MetalView *)self.contentView update];
}

Class<RCTComponentViewProtocol> WebGPUViewCls(void) { return WebGPUView.class; }

@end
#endif
Original file line number Diff line number Diff line change
@@ -1,8 +1,8 @@
#import <React/RCTUIManager.h>
#import <React/RCTViewManager.h>
#import "MetalView.h"
#import "RCTBridge.h"
#import "WebGPUModule.h"
#import <React/RCTUIManager.h>
#import <React/RCTViewManager.h>

@interface WebGPUViewManager : RCTViewManager
@end
Expand Down
Loading

0 comments on commit 01ca045

Please sign in to comment.