How to create thin instances directly from data buffer?

I have an instance buffer like so:

const buffer = new Float32Array([
    // instance 0
    0, 1, 0, 1, // color=green
    1, 0, 0, 0, // world0
    0, 1, 0, 0, // world1
    0, 0, 1, 0, // world2
    -1, 0, 0, 1, // world3
    // instance 1
    0, 0, 1, 1, // color=blue
    1, 0, 0, 0, // world0
    0, 1, 0, 0, // world1
    0, 0, 1, 0, // world2
    1, 0, 0, 1, // world3
]);

I want to create thin instances from the buffer as is without copying elements to intermediate buffer or array. Seems, thinInstanceSetBuffer doesn’t suit me because it cannot accepts an offset. I found out the only solution. But I’m confused about the hidden field _thinInstanceDataStorage. Please, advice me a better solution.

Color and matrix are 2 seperate buffers, you’d have to copy your values into these and pass them to thinInstanceSetBuffer

2 Likes

I care about performance so I would like to avoid copying. It’s possible as I wrote above, but I couldn’t find relevant public API.

As i wrote, thinInstances use 2 seperate buffers.

So, 2 options i can think of;
Split your buffer into two from the server/storage side and you can pass them directly into thinInstanceSetBuffer

Or copy into seperate buffers in js,

Micro-optimizing can be a dangerous road, there is nothing wrong with copying data.
Unless you have an unrealistic amount of instances, it won’t affect performance much and GC will take care of the unused data soon enough.

and FYI, your solution is also copying data from your buffer into vertexBuffers :slight_smile:

4 Likes

your solution is also copying data from your buffer into vertexBuffers

My buffer’s pass to vertexBuffers by reference. AFAIK VertexBuffer doesn’t make any copies, it’s just a container. It’s pass to webgl using gl.vertexAttribPointer without any copying as well.

Here’s just one more option that comes to mind, for using a single buffer. Although IDK how practical it might be for you. :slight_smile:

If you’re able to generate the data with all of the matrices at the beginning followed by all the colors, you could create two views of the buffer (with different offsets and lengths). And then you could call thinInstanceSetBuffer for each of the views to set the matrices and colors.

4 Likes

Hello @dizel3d just checking in if you need any further assistance?