wasm: add a webassembly compiler backend, based on using binaryen (#17368)

2023-08-10 21:13:21 +03:00 · 2023-03-01 08:58:53 +11:00
parent b9a8a21094
commit 0625caad56
51 changed files with 7981 additions and 8 deletions
--- a/examples/wasm/mandelbrot/README.md
+++ b/examples/wasm/mandelbrot/README.md
@ -0,0 +1,12 @@
+# V Mandelbrot Example
+
+1. First, create `mandelbrot.wasm`. Compile with `-os browser`.
+
+```
+v -b wasm -os browser mandelbrot.v
+```
+
+2. Then, open the `mandelbrot.html` file in the browser.
+	- CORS errors do not allow `mandelbrot.wasm` to be loaded.
+	- Use `python -m http.server 8080`
+	- Use `emrun mandelbrot.html`
--- a/examples/wasm/mandelbrot/mandelbrot.html
+++ b/examples/wasm/mandelbrot/mandelbrot.html
@ -0,0 +1,47 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+	<meta charset="UTF-8">
+	<meta http-equiv="X-UA-Compatible" content="IE=edge">
+	<meta name="viewport" content="width=device-width, initial-scale=1.0">
+	<title>V Mandelbrot WebAssembly Example</title>
+</head>
+<body>
+	<canvas id="canvas" width="200" height="200" style="width:100%;height:100%;image-rendering: crisp-edges;"></canvas>
+	<script>
+		var canvas = document.getElementById("canvas");
+		var ctx = canvas.getContext("2d");
+		var memory;
+
+		function get_string(ptr, len) {
+			const buf = new Uint8Array(memory.buffer, ptr, len);
+			const str = new TextDecoder("utf8").decode(buf);
+
+			return str
+		}
+
+		const env = {
+			canvas_x: () => canvas.width,
+			canvas_y: () => canvas.height,
+			setpixel: (x, y, c) => {
+				ctx.fillStyle = "rgba(1,1,1,"+(c/255)+")";
+				ctx.fillRect(x, y, 1, 1);
+			},
+			__writeln: (ptr, len) => {
+				console.log(get_string(ptr, len))
+			},
+			__panic_abort: (ptr, len) => {
+				throw get_string(ptr, len);
+			}
+		}
+
+		WebAssembly.instantiateStreaming(fetch("mandelbrot.wasm"), {env: env}).then((res) => {
+			memory = res.instance.exports['memory'];
+			
+			console.time('main.main')
+			res.instance.exports['main.main']()
+			console.timeEnd('main.main')
+		});
+	</script>
+</body>
+</html>
--- a/examples/wasm/mandelbrot/mandelbrot.v
+++ b/examples/wasm/mandelbrot/mandelbrot.v
@ -0,0 +1,41 @@
+fn JS.canvas_x() int
+fn JS.canvas_y() int
+fn JS.setpixel(x int, y int, c f64)
+
+// `main` must be public!
+pub fn main() {
+	max_x := JS.canvas_x()
+	max_y := JS.canvas_y()
+
+	println('starting main.main!')
+
+	mut y := 0
+	for y < max_y {
+		y += 1
+		mut x := 0
+		for x < max_x {
+			x += 1
+
+			e := (f64(y) / 50) - 1.5
+			f := (f64(x) / 50) - 1.0
+
+			mut a := 0.0
+			mut b := 0.0
+			mut i := 0.0
+			mut j := 0.0
+			mut c := 0.0
+
+			for i * i + j * j < 4 && c < 255 {
+				i = a * a - b * b + e
+				j = 2 * a * b + f
+				a = i
+				b = j
+				c += 1
+			}
+
+			JS.setpixel(x, y, c)
+		}
+	}
+
+	panic('reached the end!')
+}