react-native-wgpu 0.1.20 → 0.1.21

package/README.md

@@ -11,15 +11,21 @@ Please note that the package name is `react-native-wgpu`.
 npm install react-native-wgpu
 ```
 
-Below are some examples from the [example app](/package/example/).
+Below are some examples from the [example app](/apps/example/).
 
 https://github.com/user-attachments/assets/116a41b2-2cf8-49f1-9f16-a5c83637c198
 
 Starting from `r168`, Three.js runs out of the box with React Native WebGPU.
-You need to have a slight modification of [the metro config](/package/example/metro.config.js) to resolve Three.js to the WebGPU build.
+You need to have a slight modification of [the metro config](/apps/example/metro.config.js) to resolve Three.js to the WebGPU build.
+We also support [three-fiber](/apps/example/src/ThreeJS/Fiber.tsx).
+For model loading, we also need [the following polyfill](/apps/example/src/App.tsx#29).
 
 https://github.com/user-attachments/assets/5b49ef63-0a3c-4679-aeb5-e4b4dddfcc1d
 
+We also provide prebuilt binaries for visionOS and macOS.
+
+https://github.com/user-attachments/assets/2d5c618e-5b15-4cef-8558-d4ddf8c70667
+
 ## Usage
 
 Currently we recommend to use the `useCanvasEffect` to access the WebGPU context.
@@ -123,13 +129,7 @@ const style = StyleSheet.create({
 
 ## Example App
 
-To run the example app you first need to build Dawn.
-
-```sh
-$ git submodule update --init
-$ cd package && yarn
-$ yarn build-dawn
-```
+To run the example app you first need to [build Dawn or download the prebuilt binaries](#building-dawn).
 
 From there you will be able to run the example app properly.
 
@@ -184,57 +184,3 @@ device.queue.copyExternalImageToTexture(
   [imageBitmap.width, imageBitmap.height],
 );
 ```
-
-## Troubleshooting
-
-### iOS
-
-To run the React Native WebGPU project on the iOS simulator, you need to disable the Metal validation API.  
-In "Edit Scheme," uncheck "Metal Validation."
-
-<img width="1052" alt="Uncheck 'Metal Validation'" src="https://github.com/user-attachments/assets/2676e5cc-e351-4a97-bdc8-22cbd7df2ef2">
-
-### Android
-
-On an Android simulator, a CPU emulation layer is used which may result in very slow performance.
-
-## Library Development
-
-Make sure to check out the submodules:
-
-```
-git submodule update --init
-```
-
-Make sure you have all the tools required for building the Skia libraries (Android Studio, XCode, Ninja, CMake, Android NDK/build tools).
-
-### Building
-
-* `cd packages/webgpu && yarn`
-* `yarn build-dawn`
-
-### Upgrading
-
-1. `git submodule update --remote`
-2. `yarn clean-dawn`
-3. `yarn build-dawn`
-
-### Codegen
-
-* `cd packages/webgpu && yarn codegen`
-
-### Testing
-
-In the `package` folder, to run the test against Chrome for reference:
-
-```
-yarn test:ref
-```
-
-To run the e2e test, open the example app on the e2e screen.  
-By default, it will try to connect to a localhost test server.  
-If you want to run the test suite on a physical device, you can modify the address [here](/package/example/src/useClient.ts#L4).
-
-```
-yarn test
-```

package/android/CMakeLists.txt

@@ -82,7 +82,20 @@ add_library(webgpu_dawn SHARED IMPORTED)
 set_property(TARGET webgpu_dawn PROPERTY IMPORTED_LOCATION "${WEBGPU_LIBS_PATH}/libwebgpu_dawn.so")
 
 # Link
-target_link_libraries(
+if(ReactAndroid_VERSION_MINOR GREATER_EQUAL 76)
+    target_link_libraries(
+            ${PACKAGE_NAME}
+            ${FBJNI_LIBRARY}
+            log
+            jnigraphics
+            android
+            fbjni::fbjni
+            ReactAndroid::jsi
+            ReactAndroid::reactnative
+            webgpu_dawn
+        )
+else()
+    target_link_libraries(
         ${PACKAGE_NAME}
         ${FBJNI_LIBRARY}
         log
@@ -93,3 +106,4 @@ target_link_libraries(
         ReactAndroid::reactnativejni
         webgpu_dawn
     )
+endif()

package/lib/commonjs/NativeWebGPUModule.js.map

@@ -1 +1 @@
-{"version":3,"names":["_reactNative","require","_default","exports","default","TurboModuleRegistry","getEnforcing"],"sourceRoot":"../../src","sources":["NativeWebGPUModule.ts"],"mappings":";;;;;;AACA,IAAAA,YAAA,GAAAC,OAAA;AAOA;AAAA,IAAAC,QAAA,GAAAC,OAAA,CAAAC,OAAA,GACeC,gCAAmB,CAACC,YAAY,CAAO,cAAc,CAAC","ignoreList":[]}
+{"version":3,"names":["_reactNative","require","_default","exports","default","TurboModuleRegistry","getEnforcing"],"sourceRoot":"../../src","sources":["NativeWebGPUModule.ts"],"mappings":";;;;;;AACA,IAAAA,YAAA,GAAAC,OAAA;AAMA;AAAA,IAAAC,QAAA,GAAAC,OAAA,CAAAC,OAAA,GACeC,gCAAmB,CAACC,YAAY,CAAO,cAAc,CAAC","ignoreList":[]}

package/lib/module/NativeWebGPUModule.js.map

@@ -1 +1 @@
-{"version":3,"names":["TurboModuleRegistry","getEnforcing"],"sourceRoot":"../../src","sources":["NativeWebGPUModule.ts"],"mappings":"AACA,SAASA,mBAAmB,QAAQ,cAAc;AAOlD;AACA,eAAeA,mBAAmB,CAACC,YAAY,CAAO,cAAc,CAAC","ignoreList":[]}
+{"version":3,"names":["TurboModuleRegistry","getEnforcing"],"sourceRoot":"../../src","sources":["NativeWebGPUModule.ts"],"mappings":"AACA,SAASA,mBAAmB,QAAQ,cAAc;AAMlD;AACA,eAAeA,mBAAmB,CAACC,YAAY,CAAO,cAAc,CAAC","ignoreList":[]}

package/lib/typescript/src/NativeWebGPUModule.d.ts

@@ -1,7 +1,6 @@
 import type { TurboModule } from "react-native/Libraries/TurboModule/RCTExport";
 export interface Spec extends TurboModule {
     install: () => boolean;
-    createSurfaceContext: (contextId: number) => boolean;
 }
 declare const _default: Spec;
 export default _default;

package/lib/typescript/src/NativeWebGPUModule.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"NativeWebGPUModule.d.ts","sourceRoot":"","sources":["../../../src/NativeWebGPUModule.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,8CAA8C,CAAC;AAGhF,MAAM,WAAW,IAAK,SAAQ,WAAW;IACvC,OAAO,EAAE,MAAM,OAAO,CAAC;IACvB,oBAAoB,EAAE,CAAC,SAAS,EAAE,MAAM,KAAK,OAAO,CAAC;CACtD;;AAGD,wBAAsE"}
+{"version":3,"file":"NativeWebGPUModule.d.ts","sourceRoot":"","sources":["../../../src/NativeWebGPUModule.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,8CAA8C,CAAC;AAGhF,MAAM,WAAW,IAAK,SAAQ,WAAW;IACvC,OAAO,EAAE,MAAM,OAAO,CAAC;CACxB;;AAGD,wBAAsE"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-native-wgpu",
-  "version": "0.1.20",
+  "version": "0.1.21",
   "description": "React Native WebGPU",
   "main": "lib/commonjs/index",
   "module": "lib/module/index",
@@ -26,7 +26,6 @@
     "tsc": "tsc --noEmit",
     "build": "bob build",
     "build-dawn": "ts-node scripts/build/dawn.ts",
-    "copy-headers": "ts-node scripts/build/copy-headers.ts",
     "clean-dawn": "rimraf ./libs && rimraf ../../externals/dawn/out",
     "clang-format": "yarn clang-format-ios && yarn clang-format-android && yarn clang-format-common",
     "clang-format-ios": "find apple/ -iname \"*.h\" -o -iname \"*.mm\" -o -iname \"*.cpp\" | xargs clang-format -i",

package/src/NativeWebGPUModule.ts

@@ -3,7 +3,6 @@ import { TurboModuleRegistry } from "react-native";
 
 export interface Spec extends TurboModule {
   install: () => boolean;
-  createSurfaceContext: (contextId: number) => boolean;
 }
 
 // eslint-disable-next-line import/no-default-export