# WGSL Compute Shader vs JS World Matrix

**URL:** <https://forum.babylonjs.com/t/wgsl-compute-shader-vs-js-world-matrix/44663>\
**Category:** Questions\
**Created:** [October 3, 2023, 10:34pm UTC](https://forum.babylonjs.com/t/wgsl-compute-shader-vs-js-world-matrix/44663 "2023-10-03T22:34:47Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![istvan-fodor](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/istvan-fodor/32/35310_2.png) [@istvan-fodor](https://forum.babylonjs.com/u/istvan-fodor)\
**Post date:** [October 3, 2023, 10:34pm UTC](https://forum.babylonjs.com/t/wgsl-compute-shader-vs-js-world-matrix/44663/1 "2023-10-03T22:34:47Z")

</div>

Hello all,  
I am trying to replicate the worldMatrix transformation (that you would normally execute in the vertex shader) in a WGSL ComputeShader, but I cant seem to get it to work. I send in the worldMatrix as a uniform, send in the vertices, but the result buffer is all messed up - as if the numbers are shuffled or something like that. I can get the correct calculation in JS space, but the WGSL gives weird results. I created a Playground ([https://playground.babylonjs.com/#2PLUPA#3](https://playground.babylonjs.com/#2PLUPA#3)), you can see what I am talking about in the developer console. The Playground displaces a sphere and logs the correct vertex locations when calcluation is done in JS using `Vector3.TransformCoordinates`, but the WGSL ComputeShader then looks odd. I tested with `bakeTransformIntoVertices` as well, so the worldMatrix became an identity matrix, so row/column orientation could not become an issue, and I observe the same issue. It is as if the vertices I am putting in the buffer get shuffled or something like that. Also tried adding more structure to the input buffer like this, but no luck (see [https://playground.babylonjs.com/#2PLUPA#4](https://playground.babylonjs.com/#2PLUPA#4)):

```auto
struct Vertex {
    vertex : vec3<f32>,
 };

struct Vertices {
    vertices : array<Vertex>,
};

```

Switch to WebGPU before running please.

It looks as if the first vertex is correct, but the later ones are not. Maybe it is not the matrix that is causing the issue, but the stride of my buffer? Any help is appreciated!

Thank you!

---

<div class="post-metadata">

**Author:** ![Evgeni\_Popov](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/evgeni_popov/32/4432_2.png) [@Evgeni\_Popov](https://forum.babylonjs.com/u/Evgeni_Popov)\
**Post date:** [October 4, 2023, 8:57am UTC](https://forum.babylonjs.com/t/wgsl-compute-shader-vs-js-world-matrix/44663/2 "2023-10-04T08:57:50Z")

</div>



---

<div class="post-metadata">

**Author:** ![Evgeni\_Popov](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/evgeni_popov/32/4432_2.png) [@Evgeni\_Popov](https://forum.babylonjs.com/u/Evgeni_Popov)\
**Post date:** [October 4, 2023, 9:20am UTC](https://forum.babylonjs.com/t/wgsl-compute-shader-vs-js-world-matrix/44663/3 "2023-10-04T09:20:02Z")

</div>

The problem comes from alignment. There are padding rules which mean that when you declare `vertexBuffer: array<vec3<f32>>`, each element of the array will actually be a `vec4`, with a padding of 0 at the end. Instead, you should declare it as `vertexBuffer: array`` :

> **[Babylon.js Playground](https://playground.babylonjs.com/?webgpu#2PLUPA%237)**
>
> Babylon.js playground is a live editor for Babylon.js WebGL 3D scenes

---

<div class="post-metadata">

**Author:** ![Evgeni\_Popov](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/evgeni_popov/32/4432_2.png) [@Evgeni\_Popov](https://forum.babylonjs.com/u/Evgeni_Popov)\
**Post date:** [October 4, 2023, 9:20am UTC](https://forum.babylonjs.com/t/wgsl-compute-shader-vs-js-world-matrix/44663/4 "2023-10-04T09:20:08Z")

</div>



---

<div class="post-metadata">

**Author:** ![istvan-fodor](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/istvan-fodor/32/35310_2.png) [@istvan-fodor](https://forum.babylonjs.com/u/istvan-fodor)\
**Post date:** [October 4, 2023, 1:47pm UTC](https://forum.babylonjs.com/t/wgsl-compute-shader-vs-js-world-matrix/44663/5 "2023-10-04T13:47:59Z")

</div>

Thank you, this completely solved my issue!