TSL: Ensure memory alignment for struct()

[sunag]

Related issue: #31146, #30983 (comment)

Description

Ensure memory alignment for struct(). adds more robust verification.

/cc @holtsetio

[github-actions]

📦 Bundle size

Full ESM build, minified and gzipped.

	Before	After	Diff
WebGL	337.26 78.64	337.26 78.64	+0 B +0 B
WebGPU	550.64 152.68	551.16 152.84	+522 B +162 B
WebGPU Nodes	549.99 152.53	550.51 152.69	+522 B +163 B

🌳 Bundle size after tree-shaking

Minimal build including a renderer, camera, empty scene, and dependencies.

	Before	After	Diff
WebGL	468.12 113.14	468.12 113.14	+0 B +0 B
WebGPU	625.95 169.45	625.8 169.42	-151 B -33 B
WebGPU Nodes	580.8 158.77	580.65 158.74	-151 B -34 B

[holtsetio]

I can still see one edge case with wrong alignment:

struct({ 
  a: 'mat3',
  b: 'float'
})

Because each mat3 occupies 12 byte in wgpu memory, this struct would need 16 bytes, but with the code from this PR only 12 bytes would be allocated.

Also to be pedantic, line 116 of StructTypeNode.js:
offset += ( chunkOffset % boundary );
should be
offset += ( boundary - chunkOffset );
I think, right?
However since the only case I can think of where this line get executed is for chunkOffset = 4 and boundary = 8, in the case of vec2s, so the result is the same.

[holtsetio]

New approach looks good to me! :)

[holtsetio]

Ran a few more tests and found one other small discrepancy. Turns out mat2 alignment is not 16 but 8 bytes (as per https://webgpufundamentals.org/webgpu/lessons/webgpu-memory-layout.html)