KingOfDog/2020-coding-projects
Archived
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Add mandelbrot Golang with webassembly

Browse Source
This commit is contained in:
kingofdog 2020-04-27 09:53:21 +02:00
parent 9cd120ed14
commit 3c4ec2f6dc
9 changed files with 1164 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
mandelbrot-webassembly/.vscode/launch.json vendored Normal file
View File

@ -0,0 +1,10 @@
{
"version": "0.2.0",
"configurations": [{
"name": "Launch index.html",
"type": "firefox",
"request": "launch",
"reAttach": true,
"file": "${workspaceFolder}/index.html"
}]
}

4
mandelbrot-webassembly/build.sh Normal file
View File

@ -0,0 +1,4 @@
pushd server
GOOS=js GOARCH=wasm go build -o main.wasm
mv main.wasm ..
popd

22
mandelbrot-webassembly/index.html Normal file
View File

@ -0,0 +1,22 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Mandelbrot</title>
<script src="wasm_exec.js"></script>
<script>
const go = new Go();
WebAssembly.instantiateStreaming(fetch('main.wasm'), go.importObject).then(result => {
go.run(result.instance);
});
</script>
</head>
<body>
<h1>Test</h1>
<canvas id="canvas"></canvas>
</body>
</html>

9
mandelbrot-webassembly/main.go Normal file
View File

@ -0,0 +1,9 @@
package main
import (
"net/http"
)
func main() {
http.ListenAndServe(`:8002`, http.FileServer(http.Dir(`.`)))
}

126
mandelbrot-webassembly/main.js Normal file
View File

@ -0,0 +1,126 @@
const canvas = document.getElementById("canvas");
const ctx = canvas.getContext("2d");
const width = 1000;
const height = 1000;
canvas.style.width = width + "px";
canvas.style.height = height + "px";
canvas.width = width;
canvas.height = height;
let minX = -2,
minY = -2,
maxX = 2,
maxY = 2;
let selection = null;
let isMouseDown = false;
let mouseStartPosition = null;
let mandelbrot = ctx.createImageData(width, height);
function calcRe(col) {
return (col * (maxX - minX)) / width + minX;
}
function calcIm(row) {
return (row * (maxY - minY)) / height + minY;
}
function drawMandelbrotSet() {
ctx.putImageData(mandelbrot, 0, 0);
}
let needToDraw = false;
function draw() {
if (needToDraw) {
ctx.clearRect(0, 0, width, height);
drawMandelbrotSet();
}
if (selection) {
ctx.fillStyle = "rgba(0, 0, 255, 0.8)";
ctx.fillRect(
selection.startX,
selection.startY,
selection.endX - selection.startX,
selection.endY - selection.startY
);
needToDraw = true;
}
setTimeout(draw, 1000 / 60);
}
canvas.addEventListener("mousedown", (event) => {
isMouseDown = true;
selection = {
startX: event.clientX - event.target.offsetLeft,
startY: event.clientY - event.target.offsetTop,
endX: event.clientX - event.target.offsetLeft,
endY: event.clientY - event.target.offsetTop,
};
});
canvas.addEventListener("mousemove", (event) => {
if (isMouseDown) {
const posX = event.clientX - event.target.offsetLeft;
const posY = event.clientY - event.target.offsetTop;
const dx = posX - selection.startX;
const dy = posY - selection.startY;
if (Math.abs(dx) > Math.abs(dy)) {
selection.endX = selection.startX + dx;
selection.endY = selection.startY + dx;
} else {
selection.endX = selection.startX + dy;
selection.endY = selection.startY + dy;
}
}
});
canvas.addEventListener("mouseup", (event) => {
isMouseDown = false;
const newMinX = calcRe(selection.startX);
const newMinY = calcIm(selection.startY);
const newMaxX = calcRe(selection.endX);
const newMaxY = calcIm(selection.endY);
minX = newMinX;
minY = newMinY;
maxX = newMaxX;
maxY = newMaxY;
updateWorker();
selection = null;
});
let worker;
function updateWorker() {
worker.postMessage([{
mandelbrot: mandelbrot,
width,
height,
minX,
maxX,
minY,
maxY,
}]);
}
function initWorker() {
worker = new Worker('worker.js');
updateWorker();
worker.onmessage = (e) => {
mandelbrot = e.data[0];
needToDraw = true;
};
}
initWorker();
draw();

BIN
mandelbrot-webassembly/main.wasm Normal file
View File

Binary file not shown.

241
mandelbrot-webassembly/server/main.go Normal file
View File

@ -0,0 +1,241 @@
package main
import (
"fmt"
"math"
"syscall/js"
)
type selection struct {
startX int
startY int
endX int
endY int
}
type mbRender struct {
doc js.Value
ctx js.Value
backCtx []js.Value
curCtx int
width float64
height float64
minX float64
minY float64
maxX float64
maxY float64
colorMode string
imageData js.Value
mandelbrot chan Mandelbrot
mandelbrotValue Mandelbrot
mandelbrotProgress chan float64
mandelbrotProgressValue float64
mouseDown bool
hasSelection bool
selection selection
}
type Mandelbrot []byte
func (mb *mbRender) getMandelbrot(maxIterations uint) {
go func() {
mb.mandelbrot <- mb.CalculateMandelbrot(maxIterations)
}()
}
func (mb *mbRender) start() {
mb.doc = js.Global().Get("document")
canvasEl := mb.doc.Call("getElementById", "canvas")
//mb.width = mb.doc.Get("body").Get("clientWidth").Float()
//mb.height = mb.doc.Get("body").Get("clientHeight").Float()
mb.width = 1000.0
mb.height = 1000.0
mb.minX = -2.0
mb.minY = -2.0
mb.maxX = 2
mb.maxY = 2
canvasEl.Set("width", mb.width)
canvasEl.Set("height", mb.height)
mb.ctx = canvasEl.Call("getContext", "2d")
mb.imageData = mb.ctx.Call("getImageData", 0, 0, mb.width, mb.height)
mb.mandelbrot = make(chan Mandelbrot)
mb.getMandelbrot(1000)
mouseDownEvt := js.FuncOf(func(this js.Value, args []js.Value) interface{} {
evt := args[0]
mb.mouseDown = true
mb.hasSelection = true
mb.selection = selection{
startX: evt.Get("clientX").Int() - canvasEl.Get("offsetLeft").Int(),
startY: evt.Get("clientY").Int() - canvasEl.Get("offsetTop").Int(),
endX: evt.Get("clientX").Int() - canvasEl.Get("offsetLeft").Int(),
endY: evt.Get("clientY").Int() - canvasEl.Get("offsetTop").Int(),
}
return nil
})
defer mouseDownEvt.Release()
mouseMoveEvt := js.FuncOf(func(this js.Value, args []js.Value) interface{} {
evt := args[0]
if mb.mouseDown {
posX := evt.Get("clientX").Int() - canvasEl.Get("offsetLeft").Int()
posY := evt.Get("clientY").Int() - canvasEl.Get("offsetTop").Int()
dx := posX - mb.selection.startX
dy := posY - mb.selection.startY
if math.Abs(float64(dx)) > math.Abs(float64(dy)) {
mb.selection.endX = mb.selection.startX + dx
mb.selection.endY = mb.selection.startY + dx
} else {
mb.selection.endX = mb.selection.startX + dy
mb.selection.endY = mb.selection.startY + dy
}
}
return nil
})
defer mouseMoveEvt.Release()
mouseUpEvt := js.FuncOf(func(this js.Value, args []js.Value) interface{} {
mb.mouseDown = false
mb.hasSelection = false
newMinX := CalcReal(float64(mb.selection.startX), mb.width, mb.minX, mb.maxX)
newMinY := CalcReal(float64(mb.selection.startY), mb.height, mb.minY, mb.maxY)
newMaxX := CalcReal(float64(mb.selection.endX), mb.width, mb.minX, mb.maxX)
newMaxY := CalcReal(float64(mb.selection.endY), mb.height, mb.minY, mb.maxY)
mb.minX = newMinX
mb.minY = newMinY
mb.maxX = newMaxX
mb.maxY = newMaxY
mb.getMandelbrot(uint(math.Min(1000*1/math.Sqrt((mb.maxX-mb.minX)), 100000)))
return nil
})
defer mouseUpEvt.Release()
canvasEl.Call("addEventListener", "mousedown", mouseDownEvt)
canvasEl.Call("addEventListener", "mousemove", mouseMoveEvt)
canvasEl.Call("addEventListener", "mouseup", mouseUpEvt)
var renderFrame js.Func
renderFrame = js.FuncOf(func(this js.Value, args []js.Value) interface{} {
// mb.ctx.Call("clearRect", 0, 0, mb.width, mb.height)
select {
case x, ok := <-mb.mandelbrot:
if ok {
mb.mandelbrotValue = x
}
default:
}
select {
case x, ok := <-mb.mandelbrotProgress:
if ok {
mb.mandelbrotProgressValue = x
}
default:
}
value := js.Global().Get("Uint8Array").New(len(mb.mandelbrotValue))
js.CopyBytesToJS(value, mb.mandelbrotValue)
mb.imageData.Get("data").Call("set", value)
mb.ctx.Call("putImageData", mb.imageData, 0, 0)
if mb.hasSelection {
mb.ctx.Set("fillStyle", "rgba(0, 0, 255, 0.8)")
mb.ctx.Call("fillRect", mb.selection.startX, mb.selection.startY, mb.selection.endX-mb.selection.startX, mb.selection.endY-mb.selection.startY)
}
js.Global().Call("requestAnimationFrame", renderFrame)
return nil
})
done := make(chan struct{}, 0)
js.Global().Call("requestAnimationFrame", renderFrame)
<-done
}
func (m Mandelbrot) SetPixel(width int, x int, y int, color []byte) {
start := y*int(width)*4 + x*4
for i := 0; i < 4; i++ {
m[start+i] = color[i]
}
}
func (mb mbRender) GetColor(iteration uint, maxIterations uint) []byte {
intensity := (math.Pi / 2.0) * float64(iteration) / float64(maxIterations)
return []byte{
byte(math.Sin(intensity) * 256),
byte(math.Sin(intensity*2) * 256),
byte(math.Cos(intensity) * 256),
255,
}
// HSL - red
/*c := colorful.Hsl(float64(iteration)/256, 1.0, float64(iteration)/(float64(iteration)+8.0))
return []byte{
byte(c.R * 255),
byte(c.G * 255),
byte(c.B * 255),
255,
}*/
}
func CalcReal(x, width, minX, maxX float64) float64 {
return (x*(maxX-minX))/width + minX
}
func CalcImaginary(y, height, minY, maxY float64) float64 {
return (y*(maxY-minY))/height + minY
}
func (mb *mbRender) CalculateMandelbrot(maxIterations uint) Mandelbrot {
fmt.Println("max iterations", maxIterations)
mandelbrot := make(Mandelbrot, int(mb.width*mb.height*4))
mb.mandelbrotProgress = make(chan float64)
for row := 0; row < int(mb.height); row++ {
for col := 0; col < int(mb.width); col++ {
cRe := CalcReal(float64(col), mb.width, mb.minX, mb.maxX)
cIm := CalcImaginary(float64(row), mb.height, mb.minY, mb.maxY)
var x float64
var y float64
var iteration uint
for ; x*x+y*y <= 4 && iteration < maxIterations; iteration++ {
newX := x*x - y*y + cRe
y = 2*x*y + cIm
x = newX
}
mandelbrot.SetPixel(int(mb.width), col, row, mb.GetColor(iteration, maxIterations))
}
go func() {
mb.mandelbrotProgress <- float64(row) / mb.height
}()
}
return mandelbrot
}
func main() {
fmt.Println("Hallo fögel")
mb := mbRender{}
mb.start()
}

591
mandelbrot-webassembly/wasm_exec.js Normal file
View File

@ -0,0 +1,591 @@
// Copyright 2018 The Go Authors. All rights reserved.
// Use of this source code is governed by a BSD-style
// license that can be found in the LICENSE file.
(() => {
// Map multiple JavaScript environments to a single common API,
// preferring web standards over Node.js API.
//
// Environments considered:
// - Browsers
// - Node.js
// - Electron
// - Parcel
if (typeof global !== "undefined") {
// global already exists
} else if (typeof window !== "undefined") {
window.global = window;
} else if (typeof self !== "undefined") {
self.global = self;
} else {
throw new Error("cannot export Go (neither global, window nor self is defined)");
}
if (!global.require && typeof require !== "undefined") {
global.require = require;
}
if (!global.fs && global.require) {
global.fs = require("fs");
}
const enosys = () => {
const err = new Error("not implemented");
err.code = "ENOSYS";
return err;
};
if (!global.fs) {
let outputBuf = "";
global.fs = {
constants: { O_WRONLY: -1, O_RDWR: -1, O_CREAT: -1, O_TRUNC: -1, O_APPEND: -1, O_EXCL: -1 }, // unused
writeSync(fd, buf) {
outputBuf += decoder.decode(buf);
const nl = outputBuf.lastIndexOf("\n");
if (nl != -1) {
console.log(outputBuf.substr(0, nl));
outputBuf = outputBuf.substr(nl + 1);
}
return buf.length;
},
write(fd, buf, offset, length, position, callback) {
if (offset !== 0 || length !== buf.length || position !== null) {
callback(enosys());
return;
}
const n = this.writeSync(fd, buf);
callback(null, n);
},
chmod(path, mode, callback) { callback(enosys()); },
chown(path, uid, gid, callback) { callback(enosys()); },
close(fd, callback) { callback(enosys()); },
fchmod(fd, mode, callback) { callback(enosys()); },
fchown(fd, uid, gid, callback) { callback(enosys()); },
fstat(fd, callback) { callback(enosys()); },
fsync(fd, callback) { callback(null); },
ftruncate(fd, length, callback) { callback(enosys()); },
lchown(path, uid, gid, callback) { callback(enosys()); },
link(path, link, callback) { callback(enosys()); },
lstat(path, callback) { callback(enosys()); },
mkdir(path, perm, callback) { callback(enosys()); },
open(path, flags, mode, callback) { callback(enosys()); },
read(fd, buffer, offset, length, position, callback) { callback(enosys()); },
readdir(path, callback) { callback(enosys()); },
readlink(path, callback) { callback(enosys()); },
rename(from, to, callback) { callback(enosys()); },
rmdir(path, callback) { callback(enosys()); },
stat(path, callback) { callback(enosys()); },
symlink(path, link, callback) { callback(enosys()); },
truncate(path, length, callback) { callback(enosys()); },
unlink(path, callback) { callback(enosys()); },
utimes(path, atime, mtime, callback) { callback(enosys()); },
};
}
if (!global.process) {
global.process = {
getuid() { return -1; },
getgid() { return -1; },
geteuid() { return -1; },
getegid() { return -1; },
getgroups() { throw enosys(); },
pid: -1,
ppid: -1,
umask() { throw enosys(); },
cwd() { throw enosys(); },
chdir() { throw enosys(); },
}
}
if (!global.crypto) {
const nodeCrypto = require("crypto");
global.crypto = {
getRandomValues(b) {
nodeCrypto.randomFillSync(b);
},
};
}
if (!global.performance) {
global.performance = {
now() {
const [sec, nsec] = process.hrtime();
return sec * 1000 + nsec / 1000000;
},
};
}
if (!global.TextEncoder) {
global.TextEncoder = require("util").TextEncoder;
}
if (!global.TextDecoder) {
global.TextDecoder = require("util").TextDecoder;
}
// End of polyfills for common API.
const encoder = new TextEncoder("utf-8");
const decoder = new TextDecoder("utf-8");
global.Go = class {
constructor() {
this.argv = ["js"];
this.env = {};
this.exit = (code) => {
if (code !== 0) {
console.warn("exit code:", code);
}
};
this._exitPromise = new Promise((resolve) => {
this._resolveExitPromise = resolve;
});
this._pendingEvent = null;
this._scheduledTimeouts = new Map();
this._nextCallbackTimeoutID = 1;
const setInt64 = (addr, v) => {
this.mem.setUint32(addr + 0, v, true);
this.mem.setUint32(addr + 4, Math.floor(v / 4294967296), true);
}
const getInt64 = (addr) => {
const low = this.mem.getUint32(addr + 0, true);
const high = this.mem.getInt32(addr + 4, true);
return low + high * 4294967296;
}
const loadValue = (addr) => {
const f = this.mem.getFloat64(addr, true);
if (f === 0) {
return undefined;
}
if (!isNaN(f)) {
return f;
}
const id = this.mem.getUint32(addr, true);
return this._values[id];
}
const storeValue = (addr, v) => {
const nanHead = 0x7FF80000;
if (typeof v === "number") {
if (isNaN(v)) {
this.mem.setUint32(addr + 4, nanHead, true);
this.mem.setUint32(addr, 0, true);
return;
}
if (v === 0) {
this.mem.setUint32(addr + 4, nanHead, true);
this.mem.setUint32(addr, 1, true);
return;
}
this.mem.setFloat64(addr, v, true);
return;
}
switch (v) {
case undefined:
this.mem.setFloat64(addr, 0, true);
return;
case null:
this.mem.setUint32(addr + 4, nanHead, true);
this.mem.setUint32(addr, 2, true);
return;
case true:
this.mem.setUint32(addr + 4, nanHead, true);
this.mem.setUint32(addr, 3, true);
return;
case false:
this.mem.setUint32(addr + 4, nanHead, true);
this.mem.setUint32(addr, 4, true);
return;
}
let id = this._ids.get(v);
if (id === undefined) {
id = this._idPool.pop();
if (id === undefined) {
id = this._values.length;
}
this._values[id] = v;
this._goRefCounts[id] = 0;
this._ids.set(v, id);
}
this._goRefCounts[id]++;
let typeFlag = 1;
switch (typeof v) {
case "string":
typeFlag = 2;
break;
case "symbol":
typeFlag = 3;
break;
case "function":
typeFlag = 4;
break;
}
this.mem.setUint32(addr + 4, nanHead | typeFlag, true);
this.mem.setUint32(addr, id, true);
}
const loadSlice = (addr) => {
const array = getInt64(addr + 0);
const len = getInt64(addr + 8);
return new Uint8Array(this._inst.exports.mem.buffer, array, len);
}
const loadSliceOfValues = (addr) => {
const array = getInt64(addr + 0);
const len = getInt64(addr + 8);
const a = new Array(len);
for (let i = 0; i < len; i++) {
a[i] = loadValue(array + i * 8);
}
return a;
}
const loadString = (addr) => {
const saddr = getInt64(addr + 0);
const len = getInt64(addr + 8);
return decoder.decode(new DataView(this._inst.exports.mem.buffer, saddr, len));
}
const timeOrigin = Date.now() - performance.now();
this.importObject = {
go: {
// Go's SP does not change as long as no Go code is running. Some operations (e.g. calls, getters and setters)
// may synchronously trigger a Go event handler. This makes Go code get executed in the middle of the imported
// function. A goroutine can switch to a new stack if the current stack is too small (see morestack function).
// This changes the SP, thus we have to update the SP used by the imported function.
// func wasmExit(code int32)
"runtime.wasmExit": (sp) => {
const code = this.mem.getInt32(sp + 8, true);
this.exited = true;
delete this._inst;
delete this._values;
delete this._goRefCounts;
delete this._ids;
delete this._idPool;
this.exit(code);
},
// func wasmWrite(fd uintptr, p unsafe.Pointer, n int32)
"runtime.wasmWrite": (sp) => {
const fd = getInt64(sp + 8);
const p = getInt64(sp + 16);
const n = this.mem.getInt32(sp + 24, true);
fs.writeSync(fd, new Uint8Array(this._inst.exports.mem.buffer, p, n));
},
// func resetMemoryDataView()
"runtime.resetMemoryDataView": (sp) => {
this.mem = new DataView(this._inst.exports.mem.buffer);
},
// func nanotime1() int64
"runtime.nanotime1": (sp) => {
setInt64(sp + 8, (timeOrigin + performance.now()) * 1000000);
},
// func walltime1() (sec int64, nsec int32)
"runtime.walltime1": (sp) => {
const msec = (new Date).getTime();
setInt64(sp + 8, msec / 1000);
this.mem.setInt32(sp + 16, (msec % 1000) * 1000000, true);
},
// func scheduleTimeoutEvent(delay int64) int32
"runtime.scheduleTimeoutEvent": (sp) => {
const id = this._nextCallbackTimeoutID;
this._nextCallbackTimeoutID++;
this._scheduledTimeouts.set(id, setTimeout(
() => {
this._resume();
while (this._scheduledTimeouts.has(id)) {
// for some reason Go failed to register the timeout event, log and try again
// (temporary workaround for https://github.com/golang/go/issues/28975)
console.warn("scheduleTimeoutEvent: missed timeout event");
this._resume();
}
},
getInt64(sp + 8) + 1, // setTimeout has been seen to fire up to 1 millisecond early
));
this.mem.setInt32(sp + 16, id, true);
},
// func clearTimeoutEvent(id int32)
"runtime.clearTimeoutEvent": (sp) => {
const id = this.mem.getInt32(sp + 8, true);
clearTimeout(this._scheduledTimeouts.get(id));
this._scheduledTimeouts.delete(id);
},
// func getRandomData(r []byte)
"runtime.getRandomData": (sp) => {
crypto.getRandomValues(loadSlice(sp + 8));
},
// func finalizeRef(v ref)
"syscall/js.finalizeRef": (sp) => {
const id = this.mem.getUint32(sp + 8, true);
this._goRefCounts[id]--;
if (this._goRefCounts[id] === 0) {
const v = this._values[id];
this._values[id] = null;
this._ids.delete(v);
this._idPool.push(id);
}
},
// func stringVal(value string) ref
"syscall/js.stringVal": (sp) => {
storeValue(sp + 24, loadString(sp + 8));
},
// func valueGet(v ref, p string) ref
"syscall/js.valueGet": (sp) => {
const result = Reflect.get(loadValue(sp + 8), loadString(sp + 16));
sp = this._inst.exports.getsp(); // see comment above
storeValue(sp + 32, result);
},
// func valueSet(v ref, p string, x ref)
"syscall/js.valueSet": (sp) => {
Reflect.set(loadValue(sp + 8), loadString(sp + 16), loadValue(sp + 32));
},
// func valueDelete(v ref, p string)
"syscall/js.valueDelete": (sp) => {
Reflect.deleteProperty(loadValue(sp + 8), loadString(sp + 16));
},
// func valueIndex(v ref, i int) ref
"syscall/js.valueIndex": (sp) => {
storeValue(sp + 24, Reflect.get(loadValue(sp + 8), getInt64(sp + 16)));
},
// valueSetIndex(v ref, i int, x ref)
"syscall/js.valueSetIndex": (sp) => {
Reflect.set(loadValue(sp + 8), getInt64(sp + 16), loadValue(sp + 24));
},
// func valueCall(v ref, m string, args []ref) (ref, bool)
"syscall/js.valueCall": (sp) => {
try {
const v = loadValue(sp + 8);
const m = Reflect.get(v, loadString(sp + 16));
const args = loadSliceOfValues(sp + 32);
const result = Reflect.apply(m, v, args);
sp = this._inst.exports.getsp(); // see comment above
storeValue(sp + 56, result);
this.mem.setUint8(sp + 64, 1);
} catch (err) {
storeValue(sp + 56, err);
this.mem.setUint8(sp + 64, 0);
}
},
// func valueInvoke(v ref, args []ref) (ref, bool)
"syscall/js.valueInvoke": (sp) => {
try {
const v = loadValue(sp + 8);
const args = loadSliceOfValues(sp + 16);
const result = Reflect.apply(v, undefined, args);
sp = this._inst.exports.getsp(); // see comment above
storeValue(sp + 40, result);
this.mem.setUint8(sp + 48, 1);
} catch (err) {
storeValue(sp + 40, err);
this.mem.setUint8(sp + 48, 0);
}
},
// func valueNew(v ref, args []ref) (ref, bool)
"syscall/js.valueNew": (sp) => {
try {
const v = loadValue(sp + 8);
const args = loadSliceOfValues(sp + 16);
const result = Reflect.construct(v, args);
sp = this._inst.exports.getsp(); // see comment above
storeValue(sp + 40, result);
this.mem.setUint8(sp + 48, 1);
} catch (err) {
storeValue(sp + 40, err);
this.mem.setUint8(sp + 48, 0);
}
},
// func valueLength(v ref) int
"syscall/js.valueLength": (sp) => {
setInt64(sp + 16, parseInt(loadValue(sp + 8).length));
},
// valuePrepareString(v ref) (ref, int)
"syscall/js.valuePrepareString": (sp) => {
const str = encoder.encode(String(loadValue(sp + 8)));
storeValue(sp + 16, str);
setInt64(sp + 24, str.length);
},
// valueLoadString(v ref, b []byte)
"syscall/js.valueLoadString": (sp) => {
const str = loadValue(sp + 8);
loadSlice(sp + 16).set(str);
},
// func valueInstanceOf(v ref, t ref) bool
"syscall/js.valueInstanceOf": (sp) => {
this.mem.setUint8(sp + 24, loadValue(sp + 8) instanceof loadValue(sp + 16));
},
// func copyBytesToGo(dst []byte, src ref) (int, bool)
"syscall/js.copyBytesToGo": (sp) => {
const dst = loadSlice(sp + 8);
const src = loadValue(sp + 32);
if (!(src instanceof Uint8Array)) {
this.mem.setUint8(sp + 48, 0);
return;
}
const toCopy = src.subarray(0, dst.length);
dst.set(toCopy);
setInt64(sp + 40, toCopy.length);
this.mem.setUint8(sp + 48, 1);
},
// func copyBytesToJS(dst ref, src []byte) (int, bool)
"syscall/js.copyBytesToJS": (sp) => {
const dst = loadValue(sp + 8);
const src = loadSlice(sp + 16);
if (!(dst instanceof Uint8Array)) {
this.mem.setUint8(sp + 48, 0);
return;
}
const toCopy = src.subarray(0, dst.length);
dst.set(toCopy);
setInt64(sp + 40, toCopy.length);
this.mem.setUint8(sp + 48, 1);
},
"debug": (value) => {
console.log(value);
},
}
};
}
async run(instance) {
this._inst = instance;
this.mem = new DataView(this._inst.exports.mem.buffer);
this._values = [ // JS values that Go currently has references to, indexed by reference id
NaN,
0,
null,
true,
false,
global,
this,
];
this._goRefCounts = []; // number of references that Go has to a JS value, indexed by reference id
this._ids = new Map(); // mapping from JS values to reference ids
this._idPool = []; // unused ids that have been garbage collected
this.exited = false; // whether the Go program has exited
// Pass command line arguments and environment variables to WebAssembly by writing them to the linear memory.
let offset = 4096;
const strPtr = (str) => {
const ptr = offset;
const bytes = encoder.encode(str + "\0");
new Uint8Array(this.mem.buffer, offset, bytes.length).set(bytes);
offset += bytes.length;
if (offset % 8 !== 0) {
offset += 8 - (offset % 8);
}
return ptr;
};
const argc = this.argv.length;
const argvPtrs = [];
this.argv.forEach((arg) => {
argvPtrs.push(strPtr(arg));
});
argvPtrs.push(0);
const keys = Object.keys(this.env).sort();
keys.forEach((key) => {
argvPtrs.push(strPtr(`${key}=${this.env[key]}`));
});
argvPtrs.push(0);
const argv = offset;
argvPtrs.forEach((ptr) => {
this.mem.setUint32(offset, ptr, true);
this.mem.setUint32(offset + 4, 0, true);
offset += 8;
});
this._inst.exports.run(argc, argv);
if (this.exited) {
this._resolveExitPromise();
}
await this._exitPromise;
}
_resume() {
if (this.exited) {
throw new Error("Go program has already exited");
}
this._inst.exports.resume();
if (this.exited) {
this._resolveExitPromise();
}
}
_makeFuncWrapper(id) {
const go = this;
return function () {
const event = { id: id, this: this, args: arguments };
go._pendingEvent = event;
go._resume();
return event.result;
};
}
}
if (
global.require &&
global.require.main === module &&
global.process &&
global.process.versions &&
!global.process.versions.electron
) {
if (process.argv.length < 3) {
console.error("usage: go_js_wasm_exec [wasm binary] [arguments]");
process.exit(1);
}
const go = new Go();
go.argv = process.argv.slice(2);
go.env = Object.assign({ TMPDIR: require("os").tmpdir() }, process.env);
go.exit = process.exit;
WebAssembly.instantiate(fs.readFileSync(process.argv[2]), go.importObject).then((result) => {
process.on("exit", (code) => { // Node.js exits if no event handler is pending
if (code === 0 && !go.exited) {
// deadlock, make Go print error and stack traces
go._pendingEvent = { id: 0 };
go._resume();
}
});
return go.run(result.instance);
}).catch((err) => {
console.error(err);
process.exit(1);
});
}
})();

161
mandelbrot-webassembly/worker.js Normal file
View File

@ -0,0 +1,161 @@
function calcRe(col) {
return (col * (maxX - minX)) / width + minX;
}
function calcIm(row) {
return (row * (maxY - minY)) / height + minY;
}
function hslToRgb(h, s, l) {
var r, g, b;
if (s == 0) {
r = g = b = l; // achromatic
} else {
var hue2rgb = function hue2rgb(p, q, t) {
if (t < 0) t += 1;
if (t > 1) t -= 1;
if (t < 1 / 6) return p + (q - p) * 6 * t;
if (t < 1 / 2) return q;
if (t < 2 / 3) return p + (q - p) * (2 / 3 - t) * 6;
return p;
};
var q = l < 0.5 ? l * (1 + s) : l + s - l * s;
var p = 2 * l - q;
r = hue2rgb(p, q, h + 1 / 3);
g = hue2rgb(p, q, h);
b = hue2rgb(p, q, h - 1 / 3);
}
return [Math.round(r * 255), Math.round(g * 255), Math.round(b * 255)];
}
function getColor(iterations, maxIterations) {
const rgb = hslToRgb(iterations / 256, 1, iterations / (iterations + 8));
return [...rgb, 255];
}
function setPixel(set, width, x, y, color) {
const startIndex = y * width * 4 + x * 4;
set[startIndex + 0] = color[0];
set[startIndex + 1] = color[1];
set[startIndex + 2] = color[2];
set[startIndex + 3] = color[3];
return set;
}
async function getMandelbrotSet(maxIter, minX, minY, maxX, maxY, width, height) {
let partSet = [];
for (let i = 0; i < width * height * 4; i++) {
partSet.push(0);
}
for (let row = 0; row < height; row++) {
for (let col = 0; col < width; col++) {
const c_re = (col * (maxX - minX)) / width + minX;
const c_im = (row * (maxY - minY)) / height + minY;
let x = 0,
y = 0;
let iteration = 0;
for (; x ** 2 + y ** 2 <= 4 && iteration < maxIter; iteration++) {
const x_new = x * x - y * y + c_re;
y = 2 * x * y + c_im;
x = x_new;
}
partSet = setPixel(partSet, width, col, row, getColor(iteration, maxIter));
}
}
return partSet;
}
async function loadMandelbrotSet(resolution, minX, minY, maxX, maxY, width, height) {
return new Promise((resolve, reject) => {
const xhr = new XMLHttpRequest();
xhr.open('GET', `http://127.0.0.1:8001?minX=${minX}&maxX=${maxX}&minY=${minY}&maxY=${maxY}&width=${width}&height=${height}`, true)
xhr.send();
xhr.addEventListener('readystatechange', (e) => {
if (xhr.readyState == 4) {
const response = JSON.parse(xhr.responseText);
console.log(response);
resolve(response);
}
}, false);
});
}
async function getForResolution(resolution = 1000) {
const chunks = 4;
const chunkWidth = Math.round(width / chunks);
const chunkHeight = Math.round(height / chunks);
const dx = (maxX - minX) / chunks;
const dy = (maxY - minY) / chunks;
const promises = [];
for (let i = 0; i < chunks; i++) {
for (let j = 0; j < chunks; j++) {
promises.push(new Promise((resolve, reject) => {
const x = i;
const y = j;
loadMandelbrotSet(resolution,
minX + x * dx,
minY + y * dy,
minX + (x + 1) * dx,
minY + (y + 1) * dy,
chunkWidth,
chunkHeight
).then(partSet => {
console.log('finished', x, y);
const startRow = y * chunkHeight;
const startCol = x * chunkWidth;
console.log(startRow, startCol, chunkHeight, chunkWidth);
for (let row = 0; row < chunkHeight; row++) {
for (let col = 0; col < chunkWidth; col++) {
for (let i = 0; i < 4; i++) {
mandelbrot.data[(row + startRow) * width * 4 + (startCol + col) * 4 + i] = partSet[row * chunkWidth * 4 + col * 4 + i];
}
}
}
sendMandelbrot();
resolve();
});
}));
}
}
await Promise.all(promises);
}
let mandelbrot;
let width,
height;
let minX,
maxX,
minY,
maxY;
onmessage = function (e) {
const data = e.data[0];
mandelbrot = data.mandelbrot;
width = data.width;
height = data.height;
minX = data.minX;
minY = data.minY;
maxX = data.maxX;
maxY = data.maxY;
getForResolution();
};
function sendMandelbrot() {
postMessage([mandelbrot]);
}