https://github.com/robrohan/wasm-canvas
Demo of how to use clang to compile to wasm and write to an HTML canvas (no emscripten)
https://github.com/robrohan/wasm-canvas
c javascript wasm webassembly
Last synced: 9 months ago
JSON representation
Demo of how to use clang to compile to wasm and write to an HTML canvas (no emscripten)
- Host: GitHub
- URL: https://github.com/robrohan/wasm-canvas
- Owner: robrohan
- Created: 2021-09-18T02:48:53.000Z (almost 5 years ago)
- Default Branch: main
- Last Pushed: 2022-03-18T03:54:59.000Z (over 4 years ago)
- Last Synced: 2023-04-12T12:26:18.603Z (about 3 years ago)
- Topics: c, javascript, wasm, webassembly
- Language: C
- Homepage:
- Size: 3.18 MB
- Stars: 15
- Watchers: 3
- Forks: 3
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# WASM to Canvas with Clang - no Emscripten
This is a little project that shows an example of how to write some C code,
compile with clang, load the wasm in javascript and then display an image
created by the C code. It shows:
- How to compile into wasm from C
- How to export specific functions from C into Javascript
- How to mess with shared memory in Javascript
- An example of using `malloc` without the standard library
- Passing a buffer from Javascript to C
- Writing to a buffer in C and reading it in Javascript
- Taking a buffer and making an image
- Writing that image to a canvas
- Using requestAnimationFrame in javascript to repeatedly call into C
If you're looking for the next level of this kind of project,
[wefx](https://github.com/robrohan/wefx) does the same thing as this
project, but adds basic _draw_point_ and _draw_line_ type functions (still
using raw buffers no WebGL type calls).
The code is quite heavily commented, and should, hopefully, be self
explanatory. The start point is `src/graphics.c` and `public/test.html` and,
of course, the `Makefile`.

## Running
_WARNING_ When running the app, the animation flashes a lot of colours
rapidly. It may be seizure inducing I don't know. If you're prone to that
kind of thing be cautious.
## Mac and Linux
You'll need `make` installed (Mac and Linux no problem see `brew` or `apt`
or whatever). To compile you'll do:
```
make build
```
If you have python3 installed, you can run `make serve` and it'll build and
run a web server for you to play with on http://localhost:8000
Then use your favourite mini http server and serve up the `public` directory
(see `make start` for an example).
### Windows
On windows, you'll have to do something else, but you should be able to
build with Visual Studio, install `clang` and port the `Makefile`.