Reading integer arrays with loader into JavaScript

[JamesLMilner]

Hi there, firstly thanks for this great project, I'm really enjoying getting to dive into it. I've been looking at how to talk to JavaScript in the browser and came across the loader which seems like a nice developer experience. I've been fine with numbers, booleans, strings but I am currently struggling to get arrays over from WASM to browser side JavaScript.

Here are my files:

// AS

import "allocator/tlsf";

export { memory };

export function getIntArray(): i32[] {
	let arr: i32[] = [1,2,3,4,5];
	return arr;
}

// TS (Browser)

import { instantiateBuffer, ASUtil } from "assemblyscript/lib/loader/";

interface Test extends ASUtil {
    getIntArray: () => number;
}

// Fetch and instantiate the module
fetch("build/optimized.wasm")
    .then(response => response.arrayBuffer())
    .then(buffer => {
        const wasmModule: Test = instantiateBuffer(new Uint8Array(buffer));
        console.log(wasmModule.getArray(Int32Array, wasmModule.getIntArray()));
    })
    .catch(err => {
        console.error("Failed to load WASM: " + err.message);
        console.error(err.stack);
    });

Running this in the browser returns the error on the wasmModule.getArray(Int32Array, wasmModule.getIntArray()) line:

attempting to construct out-of-bounds TypedArray on ArrayBuffer

I've been able to get Strings working (the other loader type that requires you to explicitly export { memory }. I am not sure if there's something I'm missing for arrays?

[MaxGraey]

Currently loader not support ordinal Array. You should use Int32Array instead:

export function getIntArray(): Int32Array {
  var arr = new Int32Array(5);
  arr[0] = 1;
  arr[1] = 2;
  ...
  return arr;
}

[JamesLMilner]

Hi @MaxGraey, thanks for your swift response, that adds up! Also your code snippet works great (just had to add a missing new constructor on the Int32Array).

Would you welcome a update to the loader README specifying this behaviour? I couldn't see this information there. I'd also be willing to add some more examples that might help others using the loader if that would be of benefit.

[willemneal]

@JamesMilnerUK I completely agree that there should be more documentation surrounding how to use the loader and of course updates are welcome. This PR #411, will refactor the loader into a class, which will need some documentation.

However, the issue you are pointing out is a sticky point outside of the loader.

export function getIntArray(): i32[] {
	let arr: i32[] = [1,2,3,4,5];
	return arr;
}

The compiler will allocate the array literal to a static memory and the pointer to the array will be a global variable. This compared to new Array(), which creates it on the heap. This can cause major headaches if you assume that your literal array will be allocated each time.

export function getIntArray(): i32[] {
	let arr: i32[] = [];
        arr.push(1);
        ...
	return arr;
}

So here your array will always grow because the reference to the literal just returns its global pointer.

[stale]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.