3d – Enhance efficiency of billboarding code

I am at the moment including a billboard mode to animated sprites and static sprites in my 3D engine.

The code beneath works positive, however I wish to know if a extra optimized resolution exists. I’ve heard about one other technique utilizing the transpose the view matrix, however this make some bizarre issues in my case.

getModelMatrix() {
  let matrix = Utils.MAT4_IDENTITY();
  matrix = Utils.MAT4_MULTIPLY(matrix, Utils.MAT4_TRANSLATE(this.place[0], this.place[1], this.place[2]));
    
  if (this.billboardMode) {
    let viewMat = view.getCameraViewMatrix();
    matrix = Utils.MAT4_MULTIPLY(matrix, view.getCameraMatrix()); // used to cancel the view digicam matrix multiplication
    matrix = Utils.MAT4_MULTIPLY(matrix, Utils.MAT4_TRANSLATE(viewMat[12], viewMat[13], viewMat[14])); // however maintain place !

    // or simply do this, however not working
    // matrix = Utils.MAT4_MULTIPLY(matrix, transpose(view.getCameraViewMatrix()));
  }

  matrix = Utils.MAT4_MULTIPLY(matrix, Utils.MAT4_ROTATE_Y(this.rotation[1]));
  matrix = Utils.MAT4_MULTIPLY(matrix, Utils.MAT4_ROTATE_X(this.rotation[0])); // y -> x -> z
  matrix = Utils.MAT4_MULTIPLY(matrix, Utils.MAT4_ROTATE_Z(this.rotation[2]));
  matrix = Utils.MAT4_MULTIPLY(matrix, Utils.MAT4_SCALE(this.scale[0], this.scale[1], this.scale[2]));
  matrix = Utils.MAT4_MULTIPLY(matrix, Utils.MAT4_SCALE(1 / this.pixelsPerUnit, 1 / this.pixelsPerUnit, 0));
  matrix = Utils.MAT4_MULTIPLY(matrix, Utils.MAT4_TRANSLATE(-this.offset[0], -this.offset[1], 0));
  return matrix;
}

What’s the frequent technique to rework a sprite to billboard ?