From 89dd2b1278f9e457d9d343742a51de27502ebca1 Mon Sep 17 00:00:00 2001 From: Anders Leino Date: Mon, 30 Dec 2024 11:42:25 +0200 Subject: Add a basic WebGPU example (#5923) * Add a basic WebGPU example This helps to address #5656. * Use serial await rather than Promise.all --- examples/wgpu-html5/README.md | 25 +++++++++++++++++++++++++ 1 file changed, 25 insertions(+) create mode 100644 examples/wgpu-html5/README.md (limited to 'examples/wgpu-html5/README.md') diff --git a/examples/wgpu-html5/README.md b/examples/wgpu-html5/README.md new file mode 100644 index 000000000..f0bcc5fa5 --- /dev/null +++ b/examples/wgpu-html5/README.md @@ -0,0 +1,25 @@ +# Simple WebGPU example + +## Description + +This is a simple example showing how WebGPU and Slang can be used together. +The resulting application shows a green triangle rendered on a black background. + +More serious applications are adviced to make use of Slang's reflection API. + +## Instructions + +Get `slangc` from https://github.com/shader-slang/slang/releases/latest, or build it using the instructions under `docs/building.md`, and make sure that `slangc` is in [the `PATH` of your shell](https://en.wikipedia.org/wiki/PATH_(variable)). + +Compile the Slang shaders `shader.slang` into WGSL shaders named `shader.vertex.wgsl` and `shader.fragment.wgsl`: + + $ slangc -target wgsl -stage vertex -entry vertexMain -o shader.vertex.wgsl shader.slang + $ slangc -target wgsl -stage fragment -entry fragmentMain -o shader.fragment.wgsl shader.slang + +Alternatively, you can run `build.py` which does the same thing. + +Start a web server, for example by running the following command in this directory: + + $ python -m http.server + +Finally, visit `http://localhost:8000/` to see the application running in your browser. \ No newline at end of file -- cgit v1.2.3