Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
20 changes: 18 additions & 2 deletions apps/docs/content/api/index.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -3,17 +3,33 @@ title: Overview
description: How this API Reference relates to the standard WebGPU API.
---

## WebGPU API

React Native WebGPU implements the standard [WebGPU API](https://www.w3.org/TR/webgpu/).
Types such as `GPUDevice`, `GPUBuffer`, `GPUTexture`, and `GPURenderPipeline` behave exactly as they do on the web, so any code or tutorial written against the WebGPU specification works here unchanged.

For that reason, this reference does **not** duplicate the standard WebGPU API.
Re-documenting it would only drift out of date with the specification.
To learn the core API, use the resources below:

- [WebGPU Fundamentals](https://webgpufundamentals.org/): the best place to learn WebGPU from the ground up.
- [MDN WebGPU reference](https://developer.mozilla.org/en-US/docs/Web/API/WebGPU_API): per-type and per-method documentation.
- [WebGPU specification](https://www.w3.org/TR/webgpu/): the authoritative source.

## Core WebGPU concepts

Understanding the foundational WebGPU objects and how they interact is essential to WebGPU development.
Each concept below links to its reference on MDN.

| Concept | Description |
| ------- | ----------- |
| [Instance](https://developer.mozilla.org/en-US/docs/Web/API/GPU) | The entry point to WebGPU, exposed as `navigator.gpu`, granting access to adapters |
| [Adapter](https://developer.mozilla.org/en-US/docs/Web/API/GPUAdapter) | Represents a specific GPU on the device |
| [Device](https://developer.mozilla.org/en-US/docs/Web/API/GPUDevice) | Your logical connection to the GPU where resources are created |
| [Queue](https://developer.mozilla.org/en-US/docs/Web/API/GPUQueue) | The mechanism used to submit commands to the GPU |
| [Shader Module](https://developer.mozilla.org/en-US/docs/Web/API/GPUShaderModule) | Your GPU code, written in the WebGPU Shading Language (WGSL) |
| [Pipelines](https://developer.mozilla.org/en-US/docs/Web/API/GPURenderPipeline) | Objects describing the entire GPU state (shaders, blending) for a task |
| [Bind Groups](https://developer.mozilla.org/en-US/docs/Web/API/GPUBindGroup) | Ties data buffers (ex: textures) to shaders |
| [Command Encoder](https://developer.mozilla.org/en-US/docs/Web/API/GPUCommandEncoder) | An object used to build a sequence of GPU commands into a command buffer |

## What this reference covers

This section documents only the additions that are specific to React Native, the surface you will not find in the WebGPU specification:
Expand Down
12 changes: 6 additions & 6 deletions apps/docs/content/docs/getting-started/installation.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,12 @@ description: Your first React Native WebGPU App

React Native WebGPU brings the [WebGPU API](https://www.w3.org/TR/webgpu/) to iOS, Android, macOS, and visionOS using [Dawn](https://dawn.googlesource.com/dawn).

## Install the package

```npm
npm i react-native-webgpu
```

## Requirements

| Package | Version | Required |
Expand All @@ -14,12 +20,6 @@ React Native WebGPU brings the [WebGPU API](https://www.w3.org/TR/webgpu/) to iO

Please note that this module does not work on the legacy architecture.

## Install the package

```npm
npm i react-native-webgpu
```

## Setup

Once installed, the global `navigator.gpu` API is available - the same entry point as in Chrome or Safari:
Expand Down
2 changes: 1 addition & 1 deletion apps/docs/next-env.d.ts
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
/// <reference types="next" />
/// <reference types="next/image-types/global" />
import "./.next/types/routes.d.ts";
import "./.next/dev/types/routes.d.ts";

// NOTE: This file should not be edited
// see https://nextjs.org/docs/app/api-reference/config/typescript for more information.
Loading