Set up a basic "front-end" for the webassembly module to be tested locally from a data folder (I use python -m http.server). The WebAssembly application is now responsible for all setup/rendering through the WebGL2 context.

data/main.js

@@ -0,0 +1,80 @@
+
+import { WASM_MEMORY_PAGE_SIZE, appGlobals } from './globals.js'
+import { loadWasmModule, wasmPntrToJsString, wasmPntrAndLengthToJsString } from './wasm_functions.js'
+import { jsStdFunctions } from './std_functions.js'
+import { jsGlFunctions } from './gl_functions.js'
+
+function AcquireCanvas(canvasWidth, canvasHeight)
+{
+	var canvas = document.getElementsByTagName("canvas")[0];
+	// console.log(canvas);
+	
+	// set the display size of the canvas.
+	canvas.style.width = canvasWidth + "px";
+	canvas.style.height = canvasHeight + "px";
+	
+	// set the size of the drawingBuffer
+	var devicePixelRatio = window.devicePixelRatio || 1;
+	canvas.width = canvasWidth * devicePixelRatio;
+	canvas.height = canvasHeight * devicePixelRatio;
+	
+	// canvasContainer = document.getElementById("canvas_container");
+	// console.assert(canvasContainer != null, "Couldn't find canvas container DOM element!");
+	appGlobals.canvas = canvas;
+	return canvas;
+}
+
+function CreateGlContext(canvas)
+{
+	var canvasContextGl = canvas.getContext("webgl2");
+	if (canvasContextGl === null) { console.error("Unable to initialize WebGL render context. Your browser or machine may not support it :("); return null; }
+	// console.dir(canvasContextGl);
+	appGlobals.glContext = canvasContextGl;
+	return canvasContextGl;
+}
+
+async function LoadWasmModule(wasmFilePath, initialWasmPageCount)
+{
+	appGlobals.textDecoder = new TextDecoder("utf-8");
+	
+	let wasmEnvironment =
+	{
+		...jsStdFunctions,
+		...jsGlFunctions,
+	};
+	appGlobals.wasmModule = await loadWasmModule(wasmFilePath, wasmEnvironment);
+	
+	appGlobals.memDataView = new DataView(new Uint8Array(appGlobals.wasmModule.exports.memory.buffer).buffer);
+	// let heapBaseAddress = appGlobals.wasmModule.exports.__heap_base.value;
+	// console.log("__heap_base = " + heapBaseAddress);
+	
+	let memorySize = appGlobals.wasmModule.exports.memory.buffer.byteLength;
+	let numMemoryPagesAfterLoad = memorySize / WASM_MEMORY_PAGE_SIZE;
+	if ((memorySize % WASM_MEMORY_PAGE_SIZE) != 0)
+	{
+		console.warn("memorySize (" + memorySize + ") is not a multiple of WASM_MEMORY_PAGE_SIZE (" + WASM_MEMORY_PAGE_SIZE + ")");
+		numMemoryPagesAfterLoad++;
+	}
+	appGlobals.wasmModule.exports.init_mem(numMemoryPagesAfterLoad);
+}
+
+async function MainLoop()
+{
+	console.log("Initializing WebGL Canvas...");
+	var canvas = AcquireCanvas(600, 400);
+	var glContext = CreateGlContext(canvas);
+	
+	console.log("Loading WASM Module...");
+	await LoadWasmModule("app.wasm", 4);
+	appGlobals.wasmModule.exports.App_Initialize();
+	
+	console.log("Running!");
+	function renderFrame()
+	{
+		appGlobals.wasmModule.exports.App_UpdateAndRender();
+		window.requestAnimationFrame(renderFrame);
+	}
+	window.requestAnimationFrame(renderFrame);
+}
+
+MainLoop();