@luma.gl/webgl 8.6.0-alpha.5 → 9.0.0-alpha.11

package/src/adapter/helpers/get-shader-layout.ts

@@ -0,0 +1,407 @@
+// luma.gl, MIT license
+
+import {
+  ShaderLayout,
+  BindingLayout,
+  UniformBinding,
+  UniformBlockBinding,
+  ProgramBindings,
+  AttributeBinding,
+  VaryingBinding,
+  AttributeLayout,
+  AccessorObject
+} from '@luma.gl/api';
+import GL from '@luma.gl/constants';
+import {isWebGL2} from '../../context/context/webgl-checks';
+import Accessor from '../../classic/accessor'; // TODO - should NOT depend on classic API
+import {decodeUniformType, decodeAttributeType} from './uniforms';
+import {getVertexFormat} from '../converters/vertex-formats';
+import {isSamplerUniform} from './uniforms';
+/**
+ * Extract metadata describing binding information for a program's shaders
+ * Note: `linkProgram()` needs to have been called
+ * (although linking does not need to have been successful).
+ */
+export function getShaderLayout(gl: WebGLRenderingContext, program: WebGLProgram): ShaderLayout {
+  const programBindings = getProgramBindings(gl, program);
+
+  const shaderLayout: ShaderLayout = {
+    attributes: [],
+    bindings: []
+  };
+
+  for (const attribute of programBindings.attributes) {
+    const format =
+      // attribute.accessor.format ||
+      getVertexFormat(attribute.accessor.type || GL.FLOAT, attribute.accessor.size);
+    shaderLayout.attributes.push({
+      name: attribute.name,
+      location: attribute.location,
+      format,
+      stepMode: attribute.accessor.divisor === 1 ? 'instance' : 'vertex'
+    });
+  }
+
+  // Uniform blocks
+  for (const uniformBlock of programBindings.uniformBlocks) {
+    const uniforms = uniformBlock.uniforms.map((uniform) => ({
+      name: uniform.name,
+      format: uniform.format,
+      byteOffset: uniform.byteOffset,
+      byteStride: uniform.byteStride,
+      arrayLength: uniform.arrayLength
+    }));
+    shaderLayout.bindings.push({
+      type: 'uniform',
+      name: uniformBlock.name,
+      location: uniformBlock.location,
+      visibility: (uniformBlock.vertex ? 0x1 : 0) & (uniformBlock.fragment ? 0x2 : 0),
+      minBindingSize: uniformBlock.byteLength,
+      uniforms
+    });
+  }
+
+  let textureUnit = 0;
+  for (const uniform of programBindings.uniforms) {
+    if (isSamplerUniform(uniform.type)) {
+      const {viewDimension, sampleType} = getSamplerInfo(uniform.type);
+      shaderLayout.bindings.push({
+        type: 'texture',
+        name: uniform.name,
+        location: textureUnit,
+        viewDimension,
+        sampleType
+      });
+
+      // @ts-expect-error
+      uniform.textureUnit = textureUnit;
+      textureUnit += 1;
+    }
+  }
+
+  const uniforms = programBindings.uniforms?.filter((uniform) => uniform.location !== null) || [];
+  if (uniforms.length) {
+    shaderLayout.uniforms = uniforms;
+  }
+  if (programBindings.varyings?.length) {
+    shaderLayout.varyings = programBindings.varyings;
+  }
+
+  return shaderLayout;
+}
+
+/**
+ * Extract metadata describing binding information for a program's shaders
+ * Note: `linkProgram()` needs to have been called
+ * (although linking does not need to have been successful).
+ */
+export function getProgramBindings(
+  gl: WebGLRenderingContext,
+  program: WebGLProgram
+): ProgramBindings {
+  const config: ProgramBindings = {
+    attributes: readAttributeBindings(gl, program),
+    uniforms: readUniformBindings(gl, program),
+    uniformBlocks: readUniformBlocks(gl, program),
+    varyings: readVaryings(gl, program)
+  };
+
+  Object.seal(config);
+  return config;
+  // generateWebGPUStyleBindings(bindings);
+}
+
+/**
+ * Extract info about all transform feedback varyings
+ *
+ * linkProgram needs to have been called, although linking does not need to have been successful
+ */
+function readAttributeBindings(
+  gl: WebGLRenderingContext,
+  program: WebGLProgram
+): AttributeBinding[] {
+  const attributes: AttributeBinding[] = [];
+
+  const count = gl.getProgramParameter(program, gl.ACTIVE_ATTRIBUTES);
+
+  for (let index = 0; index < count; index++) {
+    const activeInfo = gl.getActiveAttrib(program, index);
+    if (!activeInfo) {
+      throw new Error('activeInfo');
+    }
+    const {name, type: compositeType, size} = activeInfo;
+    const location = gl.getAttribLocation(program, name);
+    // Add only user provided attributes, for built-in attributes like
+    // `gl_InstanceID` locaiton will be < 0
+    if (location >= 0) {
+      const {glType, components} = decodeAttributeType(compositeType);;
+      const accessor: AccessorObject = {type: glType, size: size * components};
+      // Any attribute name containing the word "instance" will be assumed to be instanced
+      if (/instance/i.test(name)) {
+        accessor.divisor = 1;
+      }
+      const attributeInfo = {location, name, accessor: new Accessor(accessor)}; // Base values
+      attributes.push(attributeInfo);
+    }
+  }
+
+  attributes.sort((a: AttributeBinding, b: AttributeBinding) => a.location - b.location);
+  return attributes;
+}
+
+/**
+ * Extract info about all transform feedback varyings
+ *
+ * linkProgram needs to have been called, although linking does not need to have been successful
+ */
+function readVaryings(gl: WebGLRenderingContext, program: WebGLProgram): VaryingBinding[] {
+  if (!isWebGL2(gl)) {
+    return [];
+  }
+  const gl2 = gl as WebGL2RenderingContext;
+
+  const varyings: VaryingBinding[] = [];
+
+  const count = gl.getProgramParameter(program, GL.TRANSFORM_FEEDBACK_VARYINGS);
+  for (let location = 0; location < count; location++) {
+    const activeInfo = gl2.getTransformFeedbackVarying(program, location);
+    if (!activeInfo) {
+      throw new Error('activeInfo');
+    }
+    const {name, type: compositeType, size} = activeInfo;
+    const {glType, components} = decodeUniformType(compositeType);;
+    const accessor = new Accessor({type: glType, size: size * components});
+    const varying = {location, name, accessor}; // Base values
+    varyings.push(varying);
+  }
+
+  varyings.sort((a, b) => a.location - b.location);
+  return varyings;
+}
+
+/**
+ * Extract info about all uniforms
+ *
+ * Query uniform locations and build name to setter map.
+ */
+function readUniformBindings(gl: WebGLRenderingContext, program: WebGLProgram): UniformBinding[] {
+  const uniforms: UniformBinding[] = [];
+
+  const uniformCount = gl.getProgramParameter(program, GL.ACTIVE_UNIFORMS);
+  for (let i = 0; i < uniformCount; i++) {
+    const activeInfo = gl.getActiveUniform(program, i);
+    if (!activeInfo) {
+      throw new Error('activeInfo');
+    }
+    const {name: rawName, size, type} = activeInfo;
+    const {name, isArray} = parseUniformName(rawName);
+    let webglLocation = gl.getUniformLocation(program, name);
+    const uniformInfo = {
+      // WebGL locations are uniquely typed but just numbers
+      location: webglLocation as number,
+      name,
+      size,
+      type,
+      isArray
+    };
+    uniforms.push(uniformInfo);
+
+    // Array (e.g. matrix) uniforms can occupy several 4x4 byte banks
+    if (uniformInfo.size > 1) {
+      for (let j = 0; j < uniformInfo.size; j++) {
+        const elementName = `${name}[${j}]`;
+
+        webglLocation = gl.getUniformLocation(program, elementName);
+
+        const arrayElementUniformInfo = {
+          ...uniformInfo,
+          name: elementName,
+          location: webglLocation as number
+        };
+
+        uniforms.push(arrayElementUniformInfo);
+      }
+    }
+  }
+  return uniforms;
+}
+
+/**
+ * Extract info about all "active" uniform blocks
+ *
+ * ("Active" just means that unused (aka inactive) blocks may have been
+ * optimized away during linking)
+ */
+function readUniformBlocks(
+  gl: WebGLRenderingContext,
+  program: WebGLProgram
+): UniformBlockBinding[] {
+  if (!isWebGL2(gl)) {
+    return [];
+  }
+  const gl2 = gl as WebGL2RenderingContext;
+
+  const getBlockParameter = (blockIndex: number, pname: GL): any =>
+    gl2.getActiveUniformBlockParameter(program, blockIndex, pname);
+
+  const uniformBlocks: UniformBlockBinding[] = [];
+
+  const blockCount = gl2.getProgramParameter(program, GL.ACTIVE_UNIFORM_BLOCKS);
+  for (let blockIndex = 0; blockIndex < blockCount; blockIndex++) {
+    const blockInfo: UniformBlockBinding = {
+      name: gl2.getActiveUniformBlockName(program, blockIndex) || '',
+      location: getBlockParameter(blockIndex, GL.UNIFORM_BLOCK_BINDING),
+      byteLength: getBlockParameter(blockIndex, GL.UNIFORM_BLOCK_DATA_SIZE),
+      vertex: getBlockParameter(blockIndex, GL.UNIFORM_BLOCK_REFERENCED_BY_VERTEX_SHADER),
+      fragment: getBlockParameter(blockIndex, GL.UNIFORM_BLOCK_REFERENCED_BY_FRAGMENT_SHADER),
+      uniformCount: getBlockParameter(blockIndex, GL.UNIFORM_BLOCK_ACTIVE_UNIFORMS),
+      uniforms: [] as any[]
+    };
+
+    const uniformIndices = getBlockParameter(blockIndex, GL.UNIFORM_BLOCK_ACTIVE_UNIFORM_INDICES) as number[] || [];
+
+    const uniformType = gl2.getActiveUniforms(program, uniformIndices, GL.UNIFORM_TYPE); // Array of GLenum indicating the types of the uniforms.
+    const uniformArrayLength = gl2.getActiveUniforms(program, uniformIndices, GL.UNIFORM_SIZE); // Array of GLuint indicating the sizes of the uniforms.
+    const uniformBlockIndex = gl2.getActiveUniforms(
+      program,
+      uniformIndices,
+      GL.UNIFORM_BLOCK_INDEX
+    ); // Array of GLint indicating the block indices of the uniforms.
+    const uniformOffset = gl2.getActiveUniforms(program, uniformIndices, GL.UNIFORM_OFFSET); // Array of GLint indicating the uniform buffer offsets.
+    const uniformStride = gl2.getActiveUniforms(program, uniformIndices, GL.UNIFORM_ARRAY_STRIDE); // Array of GLint indicating the strides between the elements.
+    const uniformMatrixStride = gl2.getActiveUniforms(
+      program,
+      uniformIndices,
+      GL.UNIFORM_MATRIX_STRIDE
+    ); // Array of GLint indicating the strides between columns of a column-major matrix or a row-major matrix.
+    const uniformRowMajor = gl2.getActiveUniforms(program, uniformIndices, GL.UNIFORM_IS_ROW_MAJOR);
+    for (let i = 0; i < blockInfo.uniformCount; ++i) {
+      const activeInfo = gl2.getActiveUniform(program, uniformIndices[i]);
+      if (!activeInfo) {
+        throw new Error('activeInfo');
+      }
+  
+      blockInfo.uniforms.push({
+        name: activeInfo.name,
+        format: decodeUniformType(uniformType[i]).format,
+        type: uniformType[i],
+        arrayLength: uniformArrayLength[i],
+        byteOffset: uniformOffset[i],
+        byteStride: uniformStride[i],
+        // matrixStride: uniformStride[i],
+        // rowMajor: uniformRowMajor[i]
+      });
+    }
+
+    uniformBlocks.push(blockInfo);
+  }
+
+  uniformBlocks.sort((a, b) => a.location - b.location);
+  return uniformBlocks;
+}
+
+const SAMPLER_UNIFORMS_GL_TO_GPU: Record<
+  number,
+  [
+    '1d' | '2d' | '2d-array' | 'cube' | 'cube-array' | '3d',
+    'float' | 'unfilterable-float' | 'depth' | 'sint' | 'uint'
+  ]
+> = {
+  [GL.SAMPLER_2D]: ['2d', 'float'],
+  [GL.SAMPLER_CUBE]: ['cube', 'float'],
+  [GL.SAMPLER_3D]: ['3d', 'float'],
+  [GL.SAMPLER_2D_SHADOW]: ['3d', 'depth'],
+  [GL.SAMPLER_2D_ARRAY]: ['2d-array', 'float'],
+  [GL.SAMPLER_2D_ARRAY_SHADOW]: ['2d-array', 'depth'],
+  [GL.SAMPLER_CUBE_SHADOW]: ['cube', 'float'],
+  [GL.INT_SAMPLER_2D]: ['2d', 'sint'],
+  [GL.INT_SAMPLER_3D]: ['3d', 'sint'],
+  [GL.INT_SAMPLER_CUBE]: ['cube', 'sint'],
+  [GL.INT_SAMPLER_2D_ARRAY]: ['2d-array', 'uint'],
+  [GL.UNSIGNED_INT_SAMPLER_2D]: ['2d', 'uint'],
+  [GL.UNSIGNED_INT_SAMPLER_3D]: ['3d', 'uint'],
+  [GL.UNSIGNED_INT_SAMPLER_CUBE]: ['cube', 'uint'],
+  [GL.UNSIGNED_INT_SAMPLER_2D_ARRAY]: ['2d-array', 'uint']
+};
+
+type SamplerInfo =   | {
+  viewDimension: '1d' | '2d' | '2d-array' | 'cube' | 'cube-array' | '3d';
+  sampleType: 'float' | 'unfilterable-float' | 'depth' | 'sint' | 'uint';
+};
+
+function getSamplerInfo(type: GL): SamplerInfo {
+  let sampler = SAMPLER_UNIFORMS_GL_TO_GPU[type];
+  if (!sampler) {
+    throw new Error('sampler');
+  }
+  const [viewDimension, sampleType] = sampler;
+  return {viewDimension, sampleType};
+}
+
+// HELPERS
+
+function parseUniformName(name: string): {name: string; length: number; isArray: boolean} {
+  // Shortcut to avoid redundant or bad matches
+  if (name[name.length - 1] !== ']') {
+    return {
+      name,
+      length: 1,
+      isArray: false
+    };
+  }
+
+  // if array name then clean the array brackets
+  const UNIFORM_NAME_REGEXP = /([^[]*)(\[[0-9]+\])?/;
+  const matches = name.match(UNIFORM_NAME_REGEXP);
+  if (!matches || matches.length < 2) {
+    throw new Error(`Failed to parse GLSL uniform name ${name}`);
+  }
+
+  return {
+    name: matches[1],
+    length: matches[2] ? 1 : 0,
+    isArray: Boolean(matches[2])
+  };
+}
+
+/**
+ * TODO - verify this is a copy of above and delete
+ * import type {TextureFormat} from '@luma.gl/api';
+* Extract info about all "active" uniform blocks
+ * ("Active" just means that unused (inactive) blocks may have been optimized away during linking)
+ *
+ function getUniformBlockBindings(gl, program): Binding[] {
+  if (!isWebGL2(gl)) {
+    return;
+  }
+  const bindings: Binding[] = [];
+  const count = gl.getProgramParameter(program, gl.ACTIVE_UNIFORM_BLOCKS);
+  for (let blockIndex = 0; blockIndex < count; blockIndex++) {
+    const vertex = gl.getActiveUniformBlockParameter(program, blockIndex, gl.UNIFORM_BLOCK_REFERENCED_BY_VERTEX_SHADER),
+    const fragment = gl.getActiveUniformBlockParameter(program, blockIndex, gl.UNIFORM_BLOCK_REFERENCED_BY_FRAGMENT_SHADER),
+    const visibility = (vertex) + (fragment);
+    const binding: BufferBinding = {
+      location: gl.getActiveUniformBlockParameter(program, blockIndex, gl.UNIFORM_BLOCK_BINDING),
+      // name: gl.getActiveUniformBlockName(program, blockIndex),
+      type: 'uniform',
+      visibility,
+      minBindingSize: gl.getActiveUniformBlockParameter(program, blockIndex, gl.UNIFORM_BLOCK_DATA_SIZE),
+      // uniformCount: gl.getActiveUniformBlockParameter(program, blockIndex, gl.UNIFORM_BLOCK_ACTIVE_UNIFORMS),
+      // uniformIndices: gl.getActiveUniformBlockParameter(program, blockIndex, gl.UNIFORM_BLOCK_ACTIVE_UNIFORM_INDICES),
+    }
+    bindings.push(binding);
+  }
+  return bindings;
+}
+
+function setBindings(gl2: WebGL2RenderingContext, program: WebGLProgram, bindings: Binding[][]): void {
+  for (const bindGroup of bindings) {
+    for (const binding of bindGroup) {
+
+    }
+  }
+
+  // Set up indirection table
+  // this.gl2.uniformBlockBinding(this.handle, blockIndex, blockBinding);
+}
+ */

package/src/adapter/helpers/set-uniform.ts

@@ -0,0 +1,87 @@
+// Uniforms
+import GL from '@luma.gl/constants';
+
+/** Set a raw uniform (without type conversion and caching) */
+/* eslint-disable max-len */
+export function setUniform(
+  gl: WebGLRenderingContext,
+  location: WebGLUniformLocation,
+  type: GL,
+  value: number | Float32Array | Int32Array | Uint32Array
+): void {
+  const gl2 = gl as WebGL2RenderingContext;
+
+  if (typeof value === 'number') {
+    // prettier-ignore
+    switch (type) {
+      // WebGL1 samplers
+      case GL.SAMPLER_2D:
+      case GL.SAMPLER_CUBE:
+      // WebGL2 samplers
+      case GL.SAMPLER_3D:
+      case GL.SAMPLER_2D_SHADOW:
+      case GL.SAMPLER_2D_ARRAY:
+      case GL.SAMPLER_2D_ARRAY_SHADOW:
+      case GL.SAMPLER_CUBE_SHADOW:
+      case GL.INT_SAMPLER_2D:
+      case GL.INT_SAMPLER_3D:
+      case GL.INT_SAMPLER_CUBE:
+      case GL.INT_SAMPLER_2D_ARRAY:
+      case GL.UNSIGNED_INT_SAMPLER_2D:
+      case GL.UNSIGNED_INT_SAMPLER_3D:
+      case GL.UNSIGNED_INT_SAMPLER_CUBE:
+      case GL.UNSIGNED_INT_SAMPLER_2D_ARRAY:
+        return gl.uniform1i(location, value);
+    }
+  }
+
+  // @ts-expect-error
+  if (value === true) {
+    value = 1;
+  }
+  // @ts-expect-error
+  if (value === false) {
+    value = 1;
+  }
+  const arrayValue = (typeof value === 'number') ? [value] : value;
+
+  // prettier-ignore
+  switch (type) {
+    case GL.FLOAT: return gl.uniform1fv(location, arrayValue);
+    case GL.FLOAT_VEC2: return gl.uniform2fv(location, arrayValue);
+    case GL.FLOAT_VEC3: return gl.uniform3fv(location, arrayValue);
+    case GL.FLOAT_VEC4: return gl.uniform4fv(location, arrayValue);
+
+    case GL.INT: return gl.uniform1iv(location, arrayValue);
+    case GL.INT_VEC2: return gl.uniform2iv(location, arrayValue);
+    case GL.INT_VEC3: return gl.uniform3iv(location, arrayValue);
+    case GL.INT_VEC4: return gl.uniform4iv(location, arrayValue);
+
+    case GL.BOOL: return gl.uniform1iv(location, arrayValue);
+    case GL.BOOL_VEC2: return gl.uniform2iv(location, arrayValue);
+    case GL.BOOL_VEC3: return gl.uniform3iv(location, arrayValue);
+    case GL.BOOL_VEC4: gl.uniform4iv(location, arrayValue);
+
+    // WEBGL2 - unsigned integers
+    case GL.UNSIGNED_INT: return gl2.uniform1uiv(location, arrayValue, 1);
+    case GL.UNSIGNED_INT_VEC2: return gl2.uniform2uiv(location, arrayValue, 2);
+    case GL.UNSIGNED_INT_VEC3: return gl2.uniform3uiv(location, arrayValue, 3);
+    case GL.UNSIGNED_INT_VEC4: return gl2.uniform4uiv(location, arrayValue, 4);
+
+    // WebGL2 - quadratic matrices
+    // false: don't transpose the matrix
+    case GL.FLOAT_MAT2: return gl.uniformMatrix2fv(location, false, arrayValue);
+    case GL.FLOAT_MAT3: return gl.uniformMatrix3fv(location, false, arrayValue);
+    case GL.FLOAT_MAT4: return gl.uniformMatrix4fv(location, false, arrayValue);
+
+    // WebGL2 - rectangular matrices
+    case GL.FLOAT_MAT2x3: return gl2.uniformMatrix2x3fv(location, false, arrayValue);
+    case GL.FLOAT_MAT2x4: return gl2.uniformMatrix2x4fv(location, false, arrayValue);
+    case GL.FLOAT_MAT3x2: return gl2.uniformMatrix3x2fv(location, false, arrayValue);
+    case GL.FLOAT_MAT3x4: return gl2.uniformMatrix3x4fv(location, false, arrayValue);
+    case GL.FLOAT_MAT4x2: return gl2.uniformMatrix4x2fv(location, false, arrayValue);
+    case GL.FLOAT_MAT4x3: return gl2.uniformMatrix4x3fv(location, false, arrayValue);
+  }
+
+  throw new Error('Illegal uniform');
+}

package/src/adapter/helpers/uniforms.ts

@@ -0,0 +1,121 @@
+import {UniformFormat, VertexFormat} from '@luma.gl/api';
+import GL from '@luma.gl/constants';
+import {GLUniformType, GLSamplerType, GLCompositeType, GLType} from '../../types/webgl';
+
+/** Check is uniform is of sampler type */
+export function isSamplerUniform(type: GLUniformType): boolean {
+  return SAMPLER_TYPES.includes(type as GLSamplerType);
+}
+
+const SAMPLER_TYPES: GLSamplerType[] = [
+  GL.SAMPLER_2D,
+  GL.SAMPLER_CUBE,
+  GL.SAMPLER_3D,
+  GL.SAMPLER_2D_SHADOW,
+  GL.SAMPLER_2D_ARRAY,
+  GL.SAMPLER_2D_ARRAY_SHADOW,
+  GL.SAMPLER_CUBE_SHADOW,
+  GL.INT_SAMPLER_2D,
+  GL.INT_SAMPLER_3D,
+  GL.INT_SAMPLER_CUBE,
+  GL.INT_SAMPLER_2D_ARRAY,
+  GL.UNSIGNED_INT_SAMPLER_2D,
+  GL.UNSIGNED_INT_SAMPLER_3D,
+  GL.UNSIGNED_INT_SAMPLER_CUBE,
+  GL.UNSIGNED_INT_SAMPLER_2D_ARRAY
+];
+
+// Composite types table
+const COMPOSITE_GL_TYPES: Record<
+  GLCompositeType,
+  [GLType, number, string, UniformFormat, VertexFormat?]
+> = {
+  [GL.FLOAT]: [GL.FLOAT, 1, 'float', 'f32', 'float32'],
+  [GL.FLOAT_VEC2]: [GL.FLOAT, 2, 'vec2', 'vec2<f32>', 'float32x2'],
+  [GL.FLOAT_VEC3]: [GL.FLOAT, 3, 'vec3', 'vec3<f32>', 'float32x3'],
+  [GL.FLOAT_VEC4]: [GL.FLOAT, 4, 'vec4', 'vec4<f32>', 'float32x4'],
+
+  [GL.INT]: [GL.INT, 1, 'int', 'i32', 'sint32'],
+  [GL.INT_VEC2]: [GL.INT, 2, 'ivec2', 'vec2<i32>', 'sint32x2'],
+  [GL.INT_VEC3]: [GL.INT, 3, 'ivec3', 'vec3<i32>', 'sint32x3'],
+  [GL.INT_VEC4]: [GL.INT, 4, 'ivec4', 'vec4<i32>', 'sint32x4'],
+
+  [GL.UNSIGNED_INT]: [GL.UNSIGNED_INT, 1, 'uint', 'u32', 'uint32'],
+  [GL.UNSIGNED_INT_VEC2]: [GL.UNSIGNED_INT, 2, 'uvec2', 'vec2<u32>', 'uint32x2'],
+  [GL.UNSIGNED_INT_VEC3]: [GL.UNSIGNED_INT, 3, 'uvec3', 'vec3<u32>', 'uint32x3'],
+  [GL.UNSIGNED_INT_VEC4]: [GL.UNSIGNED_INT, 4, 'uvec4', 'vec4<u32>', 'uint32x4'],
+
+  [GL.BOOL]: [GL.FLOAT, 1, 'bool', 'f32', 'float32x2'],
+  [GL.BOOL_VEC2]: [GL.FLOAT, 2, 'bvec2', 'vec2<f32>'],
+  [GL.BOOL_VEC3]: [GL.FLOAT, 3, 'bvec3', 'vec3<f32>'],
+  [GL.BOOL_VEC4]: [GL.FLOAT, 4, 'bvec4', 'vec4<f32>'],
+
+  [GL.FLOAT_MAT2]: [GL.FLOAT, 8, 'mat2', 'mat2x2<f32>'], // 4
+  [GL.FLOAT_MAT2x3]: [GL.FLOAT, 8, 'mat2x3', 'mat2x3<f32>'], // 6
+  [GL.FLOAT_MAT2x4]: [GL.FLOAT, 8, 'mat2x4', 'mat2x4<f32>'], // 8
+
+  [GL.FLOAT_MAT3x2]: [GL.FLOAT, 12, 'mat3x2', 'mat3x2<f32>'], // 6
+  [GL.FLOAT_MAT3]: [GL.FLOAT, 12, 'mat3', 'mat3x3<f32>'], // 9
+  [GL.FLOAT_MAT3x4]: [GL.FLOAT, 12, 'mat3x4', 'mat3x4<f32>'], // 12
+
+  [GL.FLOAT_MAT4x2]: [GL.FLOAT, 16, 'mat4x2', 'mat4x2<f32>'], // 8
+  [GL.FLOAT_MAT4x3]: [GL.FLOAT, 16, 'mat4x3', 'mat4x3<f32>'], // 12
+  [GL.FLOAT_MAT4]: [GL.FLOAT, 16, 'mat4', 'mat4x4<f32>'] // 16
+};
+
+/** Decomposes a composite type GL.VEC3 into a basic type (GL.FLOAT) and components (3) */
+export function decodeUniformType(
+  uniformType: GL
+): {format: UniformFormat; components: number; glType: GLType} {
+  const typeAndSize = COMPOSITE_GL_TYPES[uniformType];
+  if (!typeAndSize) {
+    throw new Error('uniform');
+  }
+  const [glType, components, , format] = typeAndSize;
+  return {format, components, glType};
+}
+
+export function decodeAttributeType(attributeType: GL): {
+  format: VertexFormat;
+  components: number;
+  glType: GLType;
+} {
+  const typeAndSize = COMPOSITE_GL_TYPES[attributeType];
+  if (!typeAndSize) {
+    throw new Error('attribute')
+  }
+  const [glType, components, , , format] = typeAndSize;
+  return {format, components, glType};
+}
+
+/** Decomposes a composite type GL.VEC3 into a basic type (GL.FLOAT) and components (3) */
+export function decomposeCompositeGLType(
+  compositeGLType: GLCompositeType
+): {type: GLType; components: number} | null {
+  const typeAndSize = COMPOSITE_GL_TYPES[compositeGLType];
+  if (!typeAndSize) {
+    return null;
+  }
+  const [type, components] = typeAndSize;
+  return {type, components};
+}
+
+export function getCompositeGLType(type: GL, components): {glType: GLType; name: string} | null {
+  switch (type) {
+    case GL.BYTE:
+    case GL.UNSIGNED_BYTE:
+    case GL.SHORT:
+    case GL.UNSIGNED_SHORT:
+      type = GL.FLOAT;
+      break;
+    default:
+  }
+
+  for (const glType in COMPOSITE_GL_TYPES) {
+    const [compType, compComponents, name] = COMPOSITE_GL_TYPES[glType];
+    if (compType === type && compComponents === components) {
+      return {glType: Number(glType), name};
+    }
+  }
+  return null;
+}

package/src/{webgl-utils → adapter/objects}/constants-to-keys.ts

@@ -1,7 +1,8 @@
 import {assert} from '@luma.gl/api';
+import GL from '@luma.gl/constants';
 
 // Resolve a WebGL enumeration name (returns itself if already a number)
-export function getKeyValue(gl, name) {
+export function getKeyValue(gl: WebGLRenderingContext, name: string | GL): GL {
   // If not a string, return (assume number)
   if (typeof name !== 'string') {
     return name;
@@ -20,7 +21,9 @@ export function getKeyValue(gl, name) {
   return value;
 }
 
-export function getKey(gl, value) {
+export function getKey(gl: WebGLRenderingContext, value: any): string {
+  // @ts-expect-error 
+  gl = gl.gl || gl;
   value = Number(value);
   for (const key in gl) {
     if (gl[key] === value) {
@@ -30,7 +33,7 @@ export function getKey(gl, value) {
   return String(value);
 }
 
-export function getKeyType(gl, value) {
+export function getKeyType(gl: WebGLRenderingContext, value: any): string {
   assert(value !== undefined, 'undefined key');
   value = Number(value);
   for (const key in gl) {