https://takahirox.github.io/online-wgsl-editor/

A tiny WGSL online editor
https://takahirox.github.io/online-wgsl-editor/

javascript webgpu wgsl

Last synced: about 2 months ago
JSON representation

A tiny WGSL online editor

• Host: GitHub
• URL: https://takahirox.github.io/online-wgsl-editor/
• Owner: takahirox
• License: mit
• Created: 2021-10-02T00:22:05.000Z (about 3 years ago)
• Default Branch: main
• Last Pushed: 2023-04-08T22:06:27.000Z (over 1 year ago)
• Last Synced: 2024-08-02T06:15:25.663Z (5 months ago)
• Topics: javascript, webgpu, wgsl
• Language: JavaScript
• Homepage:
• Size: 593 KB
• Stars: 178
• Watchers: 9
• Forks: 8
• Open Issues: 7
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

• awesome-webgpu - Online WGSL Editor - By [Takahiro](https://github.com/takahirox) - [Repository](https://github.com/takahirox/online-wgsl-editor) (Demos / Safari)

README

        
# online-wgsl-editor

`online-wgsl-editor` is a tiny online [WGSL (WebGPU Shading language)](https://www.w3.org/TR/WGSL/) editor.

You can test WGSL on your web browser. It is good especially for people who want to learn WGSL.

## Demo

[Online demo](https://takahirox.github.io/online-wgsl-editor/index.html)

Use Chrome for the Demo. It doesn't run on FireFox and other browsers yet.

## Presentation

[WebGL + WebGPU Meetup - January 2022](https://www.khronos.org/events/webgl-webgpu-meetup-january-2022) / [Slides](https://docs.google.com/presentation/d/1WP5YGAoYvFnj2JYinV7r7SNA8sKngfW2ZNaeyIDiIy8)

## Screenshots



## How to run locally

```sh

$ git clone https://github.com/takahirox/online-wgsl-editor.git

$ cd online-wgsl-editor

$ npm install

$ npm run start

# Access http://localhost:8080 on your web browser

```

Note: To run the demo locally, download [Google Chrome Canary](https://www.google.com/chrome/canary/) and enable `#enable-unsafe-webgpu` flag via `chrome://flags`.

## Thanks to

I referred to [Three.js](https://threejs.org/) and [glMatrix](https://glmatrix.net/) for WebGPU and Math.