Sprite rendering mechanism

I looked through the part about sprite rendering in the babylon source code, and I found that every frame, the vertex data of all sprites in the spritemanager will be re-uploaded.

So, my question is, is my understanding wrong? If my understanding is correct, then the rendering efficiency will be very bad. Although there is only one drawcall, there are a large number of buffers that need to be uploaded to the GPU.

Hope someone can answer it, thank you.

// packages/dev/core/src/Sprites/spriteRenderer.ts
export class SpriteRenderer {
.....
.....
  public render() { 
          ......
          ......
          for (let index = 0; index < max; index++) {
              const sprite = sprites[index];
              if (!sprite || !sprite.isVisible) {
                  continue;
              }
  
              noSprite = false;
              sprite._animate(deltaTime);
              const baseSize = this.texture.getBaseSize(); // This could be change by the user inside the animate callback (like onAnimationEnd)
  
              this._appendSpriteVertex(offset++, sprite, 0, 0, baseSize, useRightHandedSystem, customSpriteUpdate);
              if (!this._useInstancing) {
                  this._appendSpriteVertex(offset++, sprite, 1, 0, baseSize, useRightHandedSystem, customSpriteUpdate);
                  this._appendSpriteVertex(offset++, sprite, 1, 1, baseSize, useRightHandedSystem, customSpriteUpdate);
                  this._appendSpriteVertex(offset++, sprite, 0, 1, baseSize, useRightHandedSystem, customSpriteUpdate);
              }
          }
...
...
...

Do you mind pointing which part of the code you are referring to?

ok, Ok, have updated the code above

It should mostly update the data in 1 buffer with 16 floats per sprites which would be the same relying on uniform as each draw call would need to update those uniforms.

1 Like

And the cost to detect a change will be far more expensive