@luma.gl/webgl 9.0.0-alpha.9 → 9.0.0-beta.10

package/src/adapter/converters/vertex-formats.ts

@@ -1,22 +1,83 @@
-import GL from '@luma.gl/constants';
-import {VertexFormat} from '@luma.gl/api';
+// luma.gl
+// SPDX-License-Identifier: MIT
+// Copyright (c) vis.gl contributors
 
-export function getVertexFormat(type: GL, components: number): VertexFormat {
-  const base = getDataFormat(type);
+import {GL} from '@luma.gl/constants';
+import {VertexFormat, VertexType} from '@luma.gl/core';
+
+type GLDataType =
+  | GL.UNSIGNED_BYTE
+  | GL.BYTE
+  | GL.UNSIGNED_SHORT
+  | GL.SHORT
+  | GL.UNSIGNED_INT
+  | GL.INT
+  | GL.HALF_FLOAT
+  | GL.FLOAT;
+
+/** Get vertex format from GL constants */
+export function getVertexFormatFromGL(type: GLDataType, components: 1 | 2 | 3 | 4): VertexFormat {
+  const base = getVertexTypeFromGL(type);
+  // prettier-ignore
   switch (components) {
+    // @ts-expect-error TODO deal with lack of formats
     case 1: return base;
     case 2: return `${base}x2`;
+    // @ts-expect-error TODO deal with lack of formats
     case 3: return `${base}x3`;
     case 4: return `${base}x4`;
   }
+  // @ts-ignore unreachable
+  throw new Error(String(components));
 }
 
-function getDataFormat(type: GL): 'sint32' | 'uint32' | 'float32' {
+/** Get data type from GL constants */
+export function getVertexTypeFromGL(type: GLDataType, normalized = false): VertexType {
+  // prettier-ignore
   switch (type) {
-    // TODO
-    case GL.INT: return 'sint32';
-    case GL.UNSIGNED_INT: return 'uint32';
+    // WebGPU does not support normalized 32 bit integer attributes
+    case GL.INT: return normalized ? 'sint32' : 'sint32';
+    case GL.UNSIGNED_INT: return normalized ? 'uint32' : 'uint32';
+    case GL.SHORT: return normalized ? 'sint16' : 'unorm16';
+    case GL.UNSIGNED_SHORT: return normalized ? 'uint16' : 'unorm16';
+    case GL.BYTE: return normalized ? 'sint8' : 'snorm16';
+    case GL.UNSIGNED_BYTE: return normalized ? 'uint8' : 'unorm8';
     case GL.FLOAT: return 'float32';
-    default: throw new Error(String(type));
+    case GL.HALF_FLOAT: return 'float16';
+  }
+  // @ts-ignore unreachable
+  throw new Error(String(type));
+}
+
+export function getGLFromVertexType(
+  dataType: VertexType
+):
+  | GL.UNSIGNED_BYTE
+  | GL.BYTE
+  | GL.UNSIGNED_SHORT
+  | GL.SHORT
+  | GL.UNSIGNED_INT
+  | GL.INT
+  | GL.HALF_FLOAT
+  | GL.FLOAT {
+  // prettier-ignore
+  switch (dataType) {
+    case 'uint8': return GL.UNSIGNED_BYTE;
+    case 'sint8': return GL.BYTE;
+    case 'unorm8': return GL.UNSIGNED_BYTE;
+    case 'snorm8': return GL.BYTE;
+    case 'uint16': return GL.UNSIGNED_SHORT;
+    case 'sint16': return GL.SHORT;
+    case 'unorm16': return GL.UNSIGNED_SHORT;
+    case 'snorm16': return GL.SHORT;
+    case 'uint32': return GL.UNSIGNED_INT;
+    case 'sint32': return GL.INT;
+    // WebGPU does not support normalized 32 bit integer attributes
+    // case 'unorm32': return GL.UNSIGNED_INT;
+    // case 'snorm32': return GL.INT;
+    case 'float16': return GL.HALF_FLOAT;
+    case 'float32': return GL.FLOAT;
   }
-}
+  // @ts-ignore unreachable
+  throw new Error(String(dataType));
+}

package/src/adapter/device-helpers/webgl-device-features.ts

@@ -0,0 +1,121 @@
+// luma.gl
+// SPDX-License-Identifier: MIT
+// Copyright (c) vis.gl contributors
+
+// Feature detection for WebGL
+// Provides a function that enables simple checking of which WebGL features are
+
+import {DeviceFeature, DeviceFeatures} from '@luma.gl/core';
+import {GLExtensions} from '@luma.gl/constants';
+import {getWebGLExtension} from '../../context/helpers/webgl-extensions';
+import {isTextureFeature, checkTextureFeature} from '../converters/texture-formats';
+import {TEXTURE_FEATURES} from '../converters/texture-formats';
+
+/**
+ * Defines luma.gl "feature" names and semantics
+ * when value is 'string' it is the name of the extension that enables this feature
+ */
+const WEBGL_FEATURES: Partial<Record<DeviceFeature, boolean | string>> = {
+  // optional WebGPU features
+  'depth-clip-control': 'EXT_depth_clamp', // TODO these seem subtly different
+  // 'timestamp-query' // GPUQueryType "timestamp-query"
+  // "indirect-first-instance"
+  // Textures are handled by getTextureFeatures()
+  // 'depth24unorm-stencil8' // GPUTextureFormat 'depth24unorm-stencil8'
+  // 'depth32float-stencil8' // GPUTextureFormat 'depth32float-stencil8'
+
+  // optional WebGL features
+  'timer-query-webgl': 'EXT_disjoint_timer_query_webgl2',
+  'compilation-status-async-webgl': 'KHR_parallel_shader_compile',
+  'polygon-mode-webgl': 'WEBGL_polygon_mode',
+  'provoking-vertex-webgl': 'WEBGL_provoking_vertex',
+  'shader-clip-cull-distance-webgl': 'WEBGL_clip_cull_distance',
+  'shader-noperspective-interpolation-webgl': 'NV_shader_noperspective_interpolation',
+  'shader-conservative-depth-webgl': 'EXT_conservative_depth'
+
+  // Textures are handled by getTextureFeatures()
+};
+
+/**
+ * WebGL extensions exposed as luma.gl features
+ * To minimize GL log noise and improve performance, this class ensures that
+ * - WebGL extensions are not queried until the corresponding feature is checked.
+ * - WebGL extensions are only queried once.
+ */
+export class WebGLDeviceFeatures extends DeviceFeatures {
+  protected gl: WebGL2RenderingContext;
+  protected extensions: GLExtensions;
+  protected testedFeatures = new Set<DeviceFeature>();
+
+  constructor(
+    gl: WebGL2RenderingContext,
+    extensions: GLExtensions,
+    disabledFeatures: Partial<Record<DeviceFeature, boolean>>
+  ) {
+    super([], disabledFeatures);
+    this.gl = gl;
+    this.extensions = extensions;
+    // TODO - is this really needed?
+    // Enable EXT_float_blend first: https://developer.mozilla.org/en-US/docs/Web/API/EXT_float_blend
+    getWebGLExtension(gl, 'EXT_color_buffer_float', extensions);
+  }
+
+  *[Symbol.iterator](): IterableIterator<DeviceFeature> {
+    for (const feature of Object.keys(WEBGL_FEATURES) as DeviceFeature[]) {
+      if (this.has(feature)) {
+        yield feature;
+      }
+    }
+    for (const feature of Object.keys(TEXTURE_FEATURES) as DeviceFeature[]) {
+      if (this.has(feature)) {
+        yield feature;
+      }
+    }
+    return [];
+  }
+
+  override has(feature: DeviceFeature): boolean {
+    if (this.disabledFeatures[feature]) {
+      return false;
+    }
+
+    // We have already tested this feature
+    if (!this.testedFeatures.has(feature)) {
+      this.testedFeatures.add(feature);
+
+      // Check the feature once
+      if (isTextureFeature(feature) && checkTextureFeature(this.gl, feature, this.extensions)) {
+        this.features.add(feature);
+      }
+
+      if (this.getWebGLFeature(feature)) {
+        this.features.add(feature);
+      }
+    }
+    return this.features.has(feature);
+  }
+
+  // FOR DEVICE
+
+  initializeFeatures() {
+    // @ts-expect-error
+    // eslint-disable-next-line @typescript-eslint/no-unused-vars
+    for (const feature of this) {
+      // WebGL extensions are initialized by requesting them
+    }
+  }
+
+  // IMPLEMENTATION
+
+  /** Extract all WebGL features */
+  protected getWebGLFeature(feature: DeviceFeature): boolean {
+    const featureInfo = WEBGL_FEATURES[feature];
+    // string value requires checking the corresponding WebGL extension
+    const isSupported =
+      typeof featureInfo === 'string'
+        ? Boolean(getWebGLExtension(this.gl, featureInfo, this.extensions))
+        : Boolean(featureInfo);
+
+    return isSupported;
+  }
+}

package/src/adapter/device-helpers/webgl-device-info.ts

@@ -0,0 +1,111 @@
+// luma.gl
+// SPDX-License-Identifier: MIT
+// Copyright (c) vis.gl contributors
+
+import {DeviceInfo} from '@luma.gl/core';
+import {GL, GLExtensions} from '@luma.gl/constants';
+import {getWebGLExtension} from '../../context/helpers/webgl-extensions';
+
+/** @returns strings identifying the GPU vendor and driver. */
+export function getDeviceInfo(gl: WebGL2RenderingContext, extensions: GLExtensions): DeviceInfo {
+  // "Masked" info is always available, but don't contain much useful information
+  const vendorMasked = gl.getParameter(GL.VENDOR);
+  const rendererMasked = gl.getParameter(GL.RENDERER);
+
+  // If we are lucky, unmasked info is available
+  // https://www.khronos.org/registry/webgl/extensions/WEBGL_debug_renderer_info/
+  getWebGLExtension(gl, 'WEBGL_debug_renderer_info', extensions);
+  const ext = extensions.WEBGL_debug_renderer_info;
+  const vendorUnmasked = gl.getParameter(ext ? ext.UNMASKED_VENDOR_WEBGL : GL.VENDOR);
+  const rendererUnmasked = gl.getParameter(ext ? ext.UNMASKED_RENDERER_WEBGL : GL.RENDERER);
+  const vendor = vendorUnmasked || vendorMasked;
+  const renderer = rendererUnmasked || rendererMasked;
+
+  // Driver version
+  const version = gl.getParameter(GL.VERSION) as string;
+
+  // "Sniff" the GPU type and backend from the info. This works best if unmasked info is available.
+  const gpu = identifyGPUVendor(vendor, renderer);
+  const gpuBackend = identifyGPUBackend(vendor, renderer);
+  const gpuType = identifyGPUType(vendor, renderer);
+
+  // Determine GLSL version
+  // For now, skip parsing of the long version string, just use context type below to deduce version
+  // const version = gl.getParameter(GL.SHADING_LANGUAGE_VERSION) as string;
+  // const shadingLanguageVersion = parseGLSLVersion(version);
+  const shadingLanguage = 'glsl';
+  const shadingLanguageVersion = 300;
+
+  return {
+    type: 'webgl',
+    gpu,
+    gpuType,
+    gpuBackend,
+    vendor,
+    renderer,
+    version,
+    shadingLanguage,
+    shadingLanguageVersion
+  };
+}
+
+/** "Sniff" the GPU type from the info. This works best if unmasked info is available. */
+function identifyGPUVendor(
+  vendor: string,
+  renderer: string
+): 'nvidia' | 'intel' | 'apple' | 'amd' | 'software' | 'unknown' {
+  if (/NVIDIA/i.exec(vendor) || /NVIDIA/i.exec(renderer)) {
+    return 'nvidia';
+  }
+  if (/INTEL/i.exec(vendor) || /INTEL/i.exec(renderer)) {
+    return 'intel';
+  }
+  if (/Apple/i.exec(vendor) || /Apple/i.exec(renderer)) {
+    return 'apple';
+  }
+  if (
+    /AMD/i.exec(vendor) ||
+    /AMD/i.exec(renderer) ||
+    /ATI/i.exec(vendor) ||
+    /ATI/i.exec(renderer)
+  ) {
+    return 'amd';
+  }
+  if (/SwiftShader/i.exec(vendor) || /SwiftShader/i.exec(renderer)) {
+    return 'software';
+  }
+
+  return 'unknown';
+}
+
+/** "Sniff" the GPU backend from the info. This works best if unmasked info is available. */
+function identifyGPUBackend(vendor: string, renderer: string): 'opengl' | 'metal' | 'unknown' {
+  if (/Metal/i.exec(vendor) || /Metal/i.exec(renderer)) {
+    return 'metal';
+  }
+  if (/ANGLE/i.exec(vendor) || /ANGLE/i.exec(renderer)) {
+    return 'opengl';
+  }
+  return 'unknown';
+}
+
+function identifyGPUType(
+  vendor: string,
+  renderer: string
+): 'discrete' | 'integrated' | 'cpu' | 'unknown' {
+  if (/SwiftShader/i.exec(vendor) || /SwiftShader/i.exec(renderer)) {
+    return 'cpu';
+  }
+
+  const gpuVendor = identifyGPUVendor(vendor, renderer);
+  switch (gpuVendor) {
+    case 'intel':
+      return 'integrated';
+    case 'software':
+      return 'cpu';
+    case 'unknown':
+      return 'unknown';
+    default:
+      return 'discrete';
+  }
+}

package/src/adapter/device-helpers/webgl-device-limits.ts

@@ -0,0 +1,53 @@
+// luma.gl
+// SPDX-License-Identifier: MIT
+// Copyright (c) vis.gl contributors
+
+import {DeviceLimits} from '@luma.gl/core';
+import {GL} from '@luma.gl/constants';
+
+// prettier-ignore
+export class WebGLDeviceLimits extends DeviceLimits {
+  get maxTextureDimension1D() { return 0; } // WebGL does not support 1D textures
+  get maxTextureDimension2D() { return this.getParameter(GL.MAX_TEXTURE_SIZE); }
+  get maxTextureDimension3D() { return this.getParameter(GL.MAX_3D_TEXTURE_SIZE); }
+  get maxTextureArrayLayers() { return this.getParameter(GL.MAX_ARRAY_TEXTURE_LAYERS); }
+  get maxBindGroups() { return 0; }
+  get maxDynamicUniformBuffersPerPipelineLayout() { return 0; } // TBD
+  get maxDynamicStorageBuffersPerPipelineLayout() { return 0; } // TBD
+  get maxSampledTexturesPerShaderStage() { return this.getParameter(GL.MAX_VERTEX_TEXTURE_IMAGE_UNITS); } // ) TBD
+  get maxSamplersPerShaderStage() { return this.getParameter(GL.MAX_COMBINED_TEXTURE_IMAGE_UNITS); }
+  get maxStorageBuffersPerShaderStage() { return 0; } // TBD
+  get maxStorageTexturesPerShaderStage() { return 0; } // TBD
+  get maxUniformBuffersPerShaderStage() { return this.getParameter(GL.MAX_UNIFORM_BUFFER_BINDINGS); }
+  get maxUniformBufferBindingSize() { return this.getParameter(GL.MAX_UNIFORM_BLOCK_SIZE); }
+  get maxStorageBufferBindingSize() { return 0; }
+  get minUniformBufferOffsetAlignment() { return this.getParameter(GL.UNIFORM_BUFFER_OFFSET_ALIGNMENT); }
+  get minStorageBufferOffsetAlignment() { return 0; } 
+  get maxVertexBuffers() { return 16; } // WebGL 2 supports 16 buffers, see https://github.com/gpuweb/gpuweb/issues/4284
+  get maxVertexAttributes() { return this.getParameter(GL.MAX_VERTEX_ATTRIBS); }
+  get maxVertexBufferArrayStride() { return 2048; } // TBD, this is just the default value from WebGPU
+  get maxInterStageShaderComponents() { return this.getParameter(GL.MAX_VARYING_COMPONENTS); }
+  get maxComputeWorkgroupStorageSize() { return 0; } // WebGL does not support compute shaders
+  get maxComputeInvocationsPerWorkgroup() { return 0; } // WebGL does not support compute shaders
+  get maxComputeWorkgroupSizeX() { return 0; } // WebGL does not support compute shaders
+  get maxComputeWorkgroupSizeY() { return 0; } // WebGL does not support compute shaders
+  get maxComputeWorkgroupSizeZ() { return 0; } // WebGL does not support compute shaders
+  get maxComputeWorkgroupsPerDimension() { return 0;} // WebGL does not support compute shaders
+
+  // PRIVATE
+
+  protected gl: WebGL2RenderingContext;
+  protected limits: Partial<Record<GL, number>> = {};
+
+  constructor(gl: WebGL2RenderingContext) {
+    super();
+    this.gl = gl;
+  }
+
+  protected getParameter(parameter: GL): number {
+    if (this.limits[parameter] === undefined) {
+      this.limits[parameter] = this.gl.getParameter(parameter);
+    }
+    return this.limits[parameter];
+  }
+}

package/src/adapter/helpers/{uniforms.ts → decode-webgl-types.ts}

@@ -1,6 +1,9 @@
-import {UniformFormat, VertexFormat} from '@luma.gl/api';
-import GL from '@luma.gl/constants';
-import {GLUniformType, GLSamplerType, GLCompositeType, GLType} from '../../types/webgl';
+// luma.gl
+// SPDX-License-Identifier: MIT
+// Copyright (c) vis.gl contributors
+
+import {ShaderUniformType, ShaderAttributeType, VertexFormat} from '@luma.gl/core';
+import {GL, GLUniformType, GLSamplerType, GLCompositeType, GLDataType} from '@luma.gl/constants';
 
 /** Check is uniform is of sampler type */
 export function isSamplerUniform(type: GLUniformType): boolean {
@@ -28,7 +31,7 @@ const SAMPLER_TYPES: GLSamplerType[] = [
 // Composite types table
 const COMPOSITE_GL_TYPES: Record<
   GLCompositeType,
-  [GLType, number, string, UniformFormat, VertexFormat?]
+  [GLDataType, number, string, ShaderUniformType, VertexFormat?]
 > = {
   [GL.FLOAT]: [GL.FLOAT, 1, 'float', 'f32', 'float32'],
   [GL.FLOAT_VEC2]: [GL.FLOAT, 2, 'vec2', 'vec2<f32>', 'float32x2'],
@@ -45,11 +48,12 @@ const COMPOSITE_GL_TYPES: Record<
   [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.BOOL]: [GL.FLOAT, 1, 'bool', 'f32', 'float32'],
+  [GL.BOOL_VEC2]: [GL.FLOAT, 2, 'bvec2', 'vec2<f32>', 'float32x2'],
+  [GL.BOOL_VEC3]: [GL.FLOAT, 3, 'bvec3', 'vec3<f32>', 'float32x3'],
+  [GL.BOOL_VEC4]: [GL.FLOAT, 4, 'bvec4', 'vec4<f32>', 'float32x4'],
 
+  // TODO - are sizes/components below correct?
   [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
@@ -63,11 +67,13 @@ const COMPOSITE_GL_TYPES: Record<
   [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];
+/** Decomposes a composite type (GL.VEC3) into a basic type (GL.FLOAT) and components (3) */
+export function decodeGLUniformType(glUniformType: GL): {
+  format: ShaderUniformType;
+  components: number;
+  glType: GLDataType;
+} {
+  const typeAndSize = COMPOSITE_GL_TYPES[glUniformType];
   if (!typeAndSize) {
     throw new Error('uniform');
   }
@@ -75,24 +81,28 @@ export function decodeUniformType(
   return {format, components, glType};
 }
 
-export function decodeAttributeType(attributeType: GL): {
-  format: VertexFormat;
+/** Decomposes a composite type (GL.VEC3) into a basic type (GL.FLOAT) and components (3) */
+export function decodeGLAttributeType(glAttributeType: GL): {
+  attributeType: ShaderAttributeType;
+  vertexFormat: VertexFormat;
   components: number;
-  glType: GLType;
+  // glType: GLDataType;
 } {
-  const typeAndSize = COMPOSITE_GL_TYPES[attributeType];
+  const typeAndSize = COMPOSITE_GL_TYPES[glAttributeType];
   if (!typeAndSize) {
-    throw new Error('attribute')
+    throw new Error('attribute');
   }
-  const [glType, components, , , format] = typeAndSize;
-  return {format, components, glType};
+  const [, components, , shaderType, vertexFormat] = typeAndSize;
+  // TODO sanity - if (shaderType.startsWith('mat' ...))
+  const attributeType = shaderType as unknown as ShaderAttributeType;
+  return {attributeType, vertexFormat, 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];
+export function decomposeCompositeGLDataType(
+  compositeGLDataType: GLCompositeType
+): {type: GLDataType; components: number} | null {
+  const typeAndSize = COMPOSITE_GL_TYPES[compositeGLDataType];
   if (!typeAndSize) {
     return null;
   }
@@ -100,7 +110,10 @@ export function decomposeCompositeGLType(
   return {type, components};
 }
 
-export function getCompositeGLType(type: GL, components): {glType: GLType; name: string} | null {
+export function getCompositeGLDataType(
+  type: GL,
+  components
+): {glType: GLDataType; name: string} | null {
   switch (type) {
     case GL.BYTE:
     case GL.UNSIGNED_BYTE: