@@ -11,15 +11,21 @@ Please note that the package name is `react-native-wgpu`.
11
11
npm install react-native-wgpu
12
12
```
13
13
14
- Below are some examples from the [ example app] ( /package /example/ ) .
14
+ Below are some examples from the [ example app] ( /apps /example/ ) .
15
15
16
16
https://github.com/user-attachments/assets/116a41b2-2cf8-49f1-9f16-a5c83637c198
17
17
18
18
Starting from ` r168 ` , Three.js runs out of the box with React Native WebGPU.
19
- You need to have a slight modification of [ the metro config] ( /package/example/metro.config.js ) to resolve Three.js to the WebGPU build.
19
+ You need to have a slight modification of [ the metro config] ( /apps/example/metro.config.js ) to resolve Three.js to the WebGPU build.
20
+ We also support [ three-fiber] ( /apps/example/src/ThreeJS/Fiber.tsx ) .
21
+ For model loading, we also need [ the following polyfill] ( /apps/example/src/App.tsx#29 ) .
20
22
21
23
https://github.com/user-attachments/assets/5b49ef63-0a3c-4679-aeb5-e4b4dddfcc1d
22
24
25
+ We also provide prebuilt binaries for visionOS and macOS.
26
+
27
+ https://github.com/user-attachments/assets/2d5c618e-5b15-4cef-8558-d4ddf8c70667
28
+
23
29
## Usage
24
30
25
31
Currently we recommend to use the ` useCanvasEffect ` to access the WebGPU context.
@@ -123,13 +129,7 @@ const style = StyleSheet.create({
123
129
124
130
## Example App
125
131
126
- To run the example app you first need to build Dawn.
127
-
128
- ``` sh
129
- $ git submodule update --init
130
- $ cd package && yarn
131
- $ yarn build-dawn
132
- ```
132
+ To run the example app you first need to [ build Dawn or download the prebuilt binaries] ( #building-dawn ) .
133
133
134
134
From there you will be able to run the example app properly.
135
135
@@ -184,57 +184,3 @@ device.queue.copyExternalImageToTexture(
184
184
[imageBitmap .width , imageBitmap .height ],
185
185
);
186
186
```
187
-
188
- ## Troubleshooting
189
-
190
- ### iOS
191
-
192
- To run the React Native WebGPU project on the iOS simulator, you need to disable the Metal validation API.
193
- In "Edit Scheme," uncheck "Metal Validation."
194
-
195
- <img width =" 1052 " alt =" Uncheck 'Metal Validation' " src =" https://github.com/user-attachments/assets/2676e5cc-e351-4a97-bdc8-22cbd7df2ef2 " >
196
-
197
- ### Android
198
-
199
- On an Android simulator, a CPU emulation layer is used which may result in very slow performance.
200
-
201
- ## Library Development
202
-
203
- Make sure to check out the submodules:
204
-
205
- ```
206
- git submodule update --init
207
- ```
208
-
209
- Make sure you have all the tools required for building the Skia libraries (Android Studio, XCode, Ninja, CMake, Android NDK/build tools).
210
-
211
- ### Building
212
-
213
- * ` cd packages/webgpu && yarn `
214
- * ` yarn build-dawn `
215
-
216
- ### Upgrading
217
-
218
- 1 . ` git submodule update --remote `
219
- 2 . ` yarn clean-dawn `
220
- 3 . ` yarn build-dawn `
221
-
222
- ### Codegen
223
-
224
- * ` cd packages/webgpu && yarn codegen `
225
-
226
- ### Testing
227
-
228
- In the ` package ` folder, to run the test against Chrome for reference:
229
-
230
- ```
231
- yarn test:ref
232
- ```
233
-
234
- To run the e2e test, open the example app on the e2e screen.
235
- By default, it will try to connect to a localhost test server.
236
- If you want to run the test suite on a physical device, you can modify the address [ here] ( /package/example/src/useClient.ts#L4 ) .
237
-
238
- ```
239
- yarn test
240
- ```
0 commit comments