Implement vectors without proxy

[deluksic]

Instead of using Proxy to implement swizzling, we can use new Function to compile small getters with no runtime if / switch. This should allow js engines to optimize these calls better, but more testing is needed. The most important thing is that vec[0] and vec.x are simple index access and a getter respectively.

Example swizzle getter:

get xxyw() {
  return new this._Vec4(this[0], this[0], this[1], this[3]);
}

One important change is the ability to unpack vectors like:

const [x, y] = v2

I achieve this by extending Array. Typescript doesn't understand yet that this is possible, but I think we should be able to tell it.

My first tests show almost 2x speedup in buffer.write speed, 25ms vs 40ms for 50k Circle(position, radius, styleIndex) structs.

[codesandbox-ci]

This pull request is automatically built and testable in CodeSandbox.

To see build info of the built libraries, click here or the icon next to each commit SHA.

[deluksic]

Arguably, we could pass the values directly to the constructor of the vector and not check lengths. In case someone generates thousands of vectors, these checks can add up. We could simply rely on typescript to handle this for us and not pay the runtime cost (even if small).

I think having the option to initialize using vec4(vec3(), w) would be super cool, but I did not find a way to do this without paying the cost of checking args. If someone wants to do this in js, the simplest way would be to vec4(...vec3(), w). This would work just fine, we just need to adjust the transpiler to ignore the dots.

[iwoplaza]

Awesome initiative! 👏
We have to see if creating functions on-demand works well in Hermes (React Native). If not, we can always do the generation as a build step, and ship the generated code in the package.
I'll take a closer look in the coming days 👀

[deluksic]

If it can be autogenerated on build for everyone, that would be even better! Although downsides are code size, and not being able to use the library from node without compile step. (Node has experimental type stripping support)

[iwoplaza]

To be able to validate if the generation works properly, I'd like to codegen to the file system, and commit. So even if a Node project would like to consume the library from source, it should work okay!

[deluksic]

Oooh I see

[deluksic]

Switching to es2022 seems to improve performance of vector creation. I'm not sure why yet, but given WebGPU did not exist in es2017, we might as well switch it.

[iwoplaza]

Okay, I verified that the `new Function(...)` works fine on React Native 🎉. However, doing this at runtime still makes it impossible for things like Static Hermes or Porffor (JS compilers) to optimize them well AOT.

I would still attempt to offload this work AOT as a prepublish step, and ship the generated code. For now though, we can continue experimenting and pushing the performance with a JIT approach here, as it's easier to prototype with.