@luma.gl/core 9.0.0-alpha.9 → 9.0.0-beta.2

package/src/lib/compiler-log/compiler-message.ts

@@ -0,0 +1,10 @@
+// luma.gl, MIT license
+// Copyright (c) vis.gl contributors
+
+/** WebGPU style compiler message */
+export type CompilerMessage = {
+  type: 'error' | 'warning' | 'info';
+  message: string;
+  lineNum: number;
+  linePos: number;
+}

package/src/lib/compiler-log/format-compiler-log.ts

@@ -0,0 +1,113 @@
+// luma.gl, MIT license
+import type {CompilerMessage} from './compiler-message';
+
+/** @returns annotated errors or warnings */
+export function formatCompilerLog(
+  shaderLog: readonly CompilerMessage[],
+  source: string,
+  options?: {
+    /** Include source code in the log. Either just the lines before issues or all source code */
+    showSourceCode?: 'no' | 'issues' | 'all';
+    html?: boolean;
+  }
+): string {
+  let formattedLog = '';
+  const lines = source.split(/\r?\n/);
+  const log = shaderLog.slice().sort((a, b) => a.lineNum - b.lineNum);
+
+  switch (options?.showSourceCode || 'no') {
+    case 'all':
+      // Parse the error - note: browser and driver dependent
+      let currentMessage = 0;
+      for (let lineNum = 1; lineNum <= lines.length; lineNum++) {
+        formattedLog += getNumberedLine(lines[lineNum - 1], lineNum, options);
+        while (log.length > currentMessage && log[currentMessage].lineNum === lineNum) {
+          const message = log[currentMessage++];
+          formattedLog += formatCompilerMessage(message, lines, message.lineNum, {
+            ...options,
+            inlineSource: false
+          });
+        }
+      }
+      return formattedLog;
+
+    case 'issues':
+    case 'no':
+      // Parse the error - note: browser and driver dependent
+      for (const message of shaderLog) {
+        formattedLog += formatCompilerMessage(message, lines, message.lineNum, {
+          inlineSource: options?.showSourceCode !== 'no'
+        });
+      }
+      return formattedLog;
+  }
+}
+
+// Helpers
+
+/** Format one message */
+function formatCompilerMessage(
+  message: CompilerMessage,
+  lines: readonly string[],
+  lineNum: number,
+  options: {
+    inlineSource?: boolean;
+    html?: boolean;
+  }
+): string {
+  if (options?.inlineSource) {
+    const numberedLines = getNumberedLines(lines, lineNum);
+    // If we got error position on line add a `^^^` indicator on next line
+    const positionIndicator = message.linePos > 0 ? `${' '.repeat(message.linePos + 5)}^^^\n` : '';
+    return `
+${numberedLines}${positionIndicator}${message.type.toUpperCase()}: ${message.message}
+
+`;
+  }
+  return options?.html
+    ? `<div class='luma-compiler-log-error' style="color:red;"><b> ${message.type.toUpperCase()}: ${message.message}</b></div>`
+    : `${message.type.toUpperCase()}: ${message.message}`;
+}
+
+function getNumberedLines(
+  lines: readonly string[],
+  lineNum: number,
+  options?: {html?: boolean}
+): string {
+  let numberedLines = '';
+  for (let lineIndex = lineNum - 2; lineIndex <= lineNum; lineIndex++) {
+    const sourceLine = lines[lineIndex - 1];
+    if (sourceLine !== undefined) {
+      numberedLines += getNumberedLine(sourceLine, lineNum, options);
+    }
+  }
+  return numberedLines;
+}
+
+function getNumberedLine(line: string, lineNum: number, options?: {html?: boolean}): string {
+  const escapedLine = options?.html ? escapeHTML(line) : line;
+  return `${padLeft(String(lineNum), 4)}: ${escapedLine}${options?.html ? '<br/>' : '\n'}`;
+}
+
+/**
+ * Pads a string with a number of spaces (space characters) to the left
+ * @param {String} string - string to pad
+ * @param {Number} digits - number of spaces to add
+ * @return {String} string - The padded string
+ */
+function padLeft(string: string, paddedLength: number): string {
+  let result = '';
+  for (let i = string.length; i < paddedLength; ++i) {
+    result += ' ';
+  }
+  return result + string;
+}
+
+function escapeHTML(unsafe: string): string {
+  return unsafe
+    .replaceAll('&', '&amp;')
+    .replaceAll('<', '&lt;')
+    .replaceAll('>', '&gt;')
+    .replaceAll('"', '&quot;')
+    .replaceAll('\'', '&#039;');
+}

package/src/lib/compiler-log/get-shader-info.ts

@@ -0,0 +1,41 @@
+// luma.gl, MIT license
+// Copyright (c) vis.gl contributors
+
+// Note: This was the only dependency that made @luma.gl/webgl depend on @luma.gl/shadertools
+// This file was coped from shadertools to avoid the dependency
+
+/** Information extracted from shader source code */
+export type ShaderInfo = {
+  name: string;
+  language: 'glsl' | 'wgsl';
+  version: number;
+};
+
+/** Extracts information from shader source code */
+export function getShaderInfo(source: string, defaultName?: string): ShaderInfo {
+  return {
+    name: getShaderName(source, defaultName),
+    language: 'glsl',
+    version: getShaderVersion(source)
+  };
+}
+
+/** Extracts GLSLIFY style naming of shaders: `#define SHADER_NAME ...` */
+function getShaderName(shader: string, defaultName: string = 'unnamed'): string {
+  const SHADER_NAME_REGEXP = /#define[\s*]SHADER_NAME[\s*]([A-Za-z0-9_-]+)[\s*]/;
+  const match = SHADER_NAME_REGEXP.exec(shader);
+  return match ? match[1] : defaultName;
+}
+
+/** returns GLSL shader version of given shader string */
+function getShaderVersion(source: string): number {
+  let version = 100;
+  const words = source.match(/[^\s]+/g);
+  if (words && words.length >= 2 && words[0] === '#version') {
+    const v = parseInt(words[1], 10);
+    if (Number.isFinite(v)) {
+      version = v;
+    }
+  }
+  return version;
+}

package/src/lib/luma.ts

@@ -0,0 +1,84 @@
+// luma.gl, MIT license
+// Copyright (c) vis.gl contributors
+
+import type {Log} from '@probe.gl/log';
+import type {DeviceProps} from '../adapter/device';
+import {Device} from '../adapter/device';
+import {StatsManager} from '../utils/stats-manager';
+import {lumaStats} from '../utils/stats-manager';
+import {log} from '../utils/log';
+import {assert} from '../utils/assert';
+
+
+const deviceList = new Map<string, typeof Device>();
+
+/**
+ * Entry point to the luma.gl GPU abstraction
+ * Register WebGPU and/or WebGL devices (controls application bundle size)
+ * Run-time selection of the first available Device
+ */
+export class luma {
+  /** Global stats for all devices */
+  static stats: StatsManager = lumaStats;
+
+  /** Global log */
+  static log: Log = log;
+
+  static registerDevices(deviceClasses: any[] /* : typeof Device */): void {
+    for (const deviceClass of deviceClasses) {
+      assert(deviceClass.type && deviceClass.isSupported && deviceClass.create);
+      deviceList.set(deviceClass.type, deviceClass);
+    }
+  }
+
+  static getAvailableDevices(): string[] {
+    // @ts-expect-error
+    return Array.from(deviceList).map(Device => Device.type);
+  }
+
+  static getSupportedDevices(): string[] {
+    // @ts-expect-error
+    return Array.from(deviceList).filter(Device => Device.isSupported()).map(Device => Device.type);
+  }
+
+  static setDefaultDeviceProps(props: DeviceProps): void {
+    Object.assign(Device.defaultProps, props);
+  }
+
+  /** Creates a device. Asynchronously. */
+  static async createDevice(props: DeviceProps = {}): Promise<Device> {
+    props = {...Device.defaultProps, ...props}
+    if (props.gl) {
+      props.type = 'webgl';
+    }
+
+    let DeviceClass: any;
+    switch (props.type) {
+      case 'webgpu':
+        DeviceClass = deviceList.get('webgpu');
+        if (DeviceClass) {
+          return await DeviceClass.create(props);
+        }
+        break;
+      case 'webgl':
+      case 'webgl1':
+      case 'webgl2':
+        DeviceClass = deviceList.get('webgl');
+        if (DeviceClass) {
+          return await DeviceClass.create(props);
+        }
+        break;
+      case 'best-available':
+        DeviceClass = deviceList.get('webgpu');
+        if (DeviceClass && DeviceClass.isSupported()) {
+          return await DeviceClass.create(props);
+        }
+        DeviceClass = deviceList.get('webgl');
+        if (DeviceClass && DeviceClass.isSupported()) {
+          return await DeviceClass.create(props);
+        }
+        break;
+    }
+    throw new Error('No matching device found. Ensure `@luma.gl/webgl` and/or `@luma.gl/webgpu` modules are imported.');
+  }
+}

package/src/lib/uniforms/uniform-block.ts

@@ -0,0 +1,80 @@
+// luma.gl, MIT license
+import type {ShaderUniformType} from '../../adapter/types/shader-types';
+import type {UniformValue} from '../../adapter/types/types';
+import {
+  ShaderLayout,
+  UniformInfo,
+  UniformBufferBindingLayout
+} from '../../adapter/types/shader-layout';
+import {arrayEqual, arrayCopy} from '../../utils/array-equal';
+
+/**
+ * A uniform block holds values of the of uniform values for one uniform block / buffer.
+ * It also does some book keeping on what has changed, to minimize unnecessary writes to uniform buffers.
+ * @todo - Track changes to individual uniforms (for WebGL1)
+ */
+export class UniformBlock<TUniforms extends Record<string, UniformValue> = Record<string, UniformValue>> {
+  name: string;
+
+  uniforms: Record<keyof TUniforms, UniformValue> = {} as Record<keyof TUniforms, UniformValue>;
+  modifiedUniforms: Record<keyof TUniforms, boolean> = {} as Record<keyof TUniforms, boolean>;
+  modified: boolean = true;
+
+  readonly bindingLayout: Record<string, UniformInfo> = {};
+  needsRedraw: string | false = 'initialized';
+
+  constructor(props?: {
+    name?: string;
+    shaderLayout?: ShaderLayout;
+    uniformTypes?: Record<keyof TUniforms, Record<string, ShaderUniformType>>;
+  }) {
+    this.name = props?.name;
+
+    // TODO - Extract uniform layout from the shaderLayout object
+    if (props?.name && props?.shaderLayout) {
+      const binding = props?.shaderLayout.bindings?.find(
+        binding => binding.type === 'uniform' && binding.name === props?.name
+      );
+      if (!binding) {
+        throw new Error(props?.name);
+      }
+
+      const uniformBlock = binding as UniformBufferBindingLayout;
+      for (const uniform of uniformBlock.uniforms || []) {
+        this.bindingLayout[uniform.name] = uniform;
+      }
+    }
+  }
+
+  /** Set a map of uniforms */
+  setUniforms(uniforms: Partial<TUniforms>): void {
+    for (const [key, value] of Object.entries(uniforms)) {
+      this._setUniform(key, value);
+      if (!this.needsRedraw) {
+        this.setNeedsRedraw(`${this.name}.${key}=${value}`);
+      }
+    }
+  }
+
+  setNeedsRedraw(reason: string): void {
+    this.needsRedraw = this.needsRedraw || reason;
+  }
+
+  /** Returns all uniforms */
+  getAllUniforms(): Record<string, UniformValue> {
+    // @ts-expect-error
+    this.modifiedUniforms = {};
+    this.needsRedraw = false;
+    return (this.uniforms || {}) as Record<string, UniformValue>;
+  }
+
+  /** Set a single uniform */
+  private _setUniform(key: keyof TUniforms, value: UniformValue) {
+    if (arrayEqual(this.uniforms[key], value)) {
+      return;
+    }
+    this.uniforms[key] = arrayCopy(value);
+    this.modifiedUniforms[key] = true;
+    this.modified = true;
+  }
+}

package/src/lib/uniforms/uniform-buffer-layout.ts

@@ -0,0 +1,109 @@
+// luma.gl, MIT license
+import type {ShaderUniformType, ShaderDataType} from '../../adapter/types/shader-types';
+import type {UniformValue} from '../../adapter/types/types';
+import {decodeShaderUniformType, alignTo} from '../../adapter/type-utils/decode-shader-types';
+import {getScratchArrayBuffer} from '../../utils/array-utils-flat';
+import {isNumberArray} from '../../utils/is-array';
+import { log } from '../../utils/log';
+
+/** 
+ * Smallest buffer size that can be used for uniform buffers.
+ * TODO - does this depend on device?
+ */
+const minBufferSize: number = 1024;
+
+/**
+ * Std140 layout for uniform buffers
+ * Supports manual listing of uniforms
+ */
+export class UniformBufferLayout {
+  readonly layout: Record<string, {offset: number, size: number, type: ShaderDataType}> = {};
+
+  /** number of bytes needed for buffer allocation */
+  readonly byteLength: number;
+
+
+  /** Create a new UniformBufferLayout given a map of attributes. */
+  constructor(uniformTypes: Record<string, ShaderUniformType>) {
+    /** number of 4 byte slots taken */
+    let size: number = 0;
+
+    // Add layout (type, size and offset) definitions for each uniform in the layout
+    for (const [key, uniformType] of Object.entries(uniformTypes)) {
+      const typeAndComponents = decodeShaderUniformType(uniformType);
+      const {type, components: count} = typeAndComponents;
+      // First, align (bump) current offset to an even multiple of current object (1, 2, 4)
+      size = alignTo(size, count);
+      // Use the aligned size as the offset of the current uniform.
+      const offset = size;
+      // Then, add our object's padded size ((1, 2, multiple of 4) to the current offset
+      size += count;
+      this.layout[key] = {type, size: count, offset};
+    }
+    size += (4 - (size % 4)) % 4;
+
+    const actualByteLength = size * 4;
+    this.byteLength = Math.max(actualByteLength, minBufferSize);
+  }
+
+  /** Get the data for the complete buffer */
+  getData(uniformValues: Record<string, UniformValue>): Uint8Array {
+    const bufferSize = Math.max(this.byteLength, minBufferSize);
+
+    // Allocate three typed arrays pointing at same memory
+    const arrayBuffer = getScratchArrayBuffer(bufferSize);
+    const typedArrays = {
+      i32: new Int32Array(arrayBuffer),
+      u32: new Uint32Array(arrayBuffer),
+      f32: new Float32Array(arrayBuffer),
+      // TODO not implemented
+      f16: new Uint16Array(arrayBuffer)
+    };
+    // TODO is this needed?
+    // typedArrays.i32.fill(0);
+    
+    for (const [name, value] of Object.entries(uniformValues)) {
+      const uniformLayout = this.layout[name];
+      if (!uniformLayout) {
+        log.warn(`Supplied uniform value ${name} not present in uniform block layout`)();
+        // eslint-disable-next-line no-continue
+        continue;
+      }
+
+      const {type, size, offset} = uniformLayout;
+      const typedArray = typedArrays[type];
+      if (size === 1) {
+        if (typeof value !== 'number' && typeof value !== 'boolean') {
+          log.warn(`Supplied value for single component uniform ${name} is not a number: ${value}`)();
+          // eslint-disable-next-line no-continue
+          continue;
+        }
+        // single value -> just set it
+        typedArray[offset] = Number(value);
+      } else {
+        const numericArray = isNumberArray(value);
+        if (!numericArray) {
+          log.warn(`Supplied value for multi component / array uniform ${name} is not a numeric array: ${value}`)();
+          // eslint-disable-next-line no-continue
+          continue;
+        }
+        // vector/matrix -> copy the supplied (typed) array, starting from offset
+        // TODO: we should limit or check size in case the supplied data overflows
+        typedArray.set(numericArray, offset);
+      }
+    }
+
+    return new Uint8Array(arrayBuffer);
+  }  
+
+  /** Does this layout have a field with specified name */
+  has(name: string) {
+    return Boolean(this.layout[name]);
+  }
+
+  /** Get offset and size for a field with specified name */
+  get(name: string): {offset: number, size: number} | undefined {
+    const layout = this.layout[name];
+    return layout;
+  }
+}

package/src/lib/uniforms/uniform-store.ts

@@ -0,0 +1,173 @@
+// luma.gl, MIT license
+import type {ShaderUniformType} from '../../adapter/types/shader-types';
+import type {UniformValue} from '../../adapter/types/types';
+import type {Device} from '../../adapter/device';
+import {Buffer} from '../../adapter/resources/buffer';
+import {UniformBlock} from './uniform-block';
+import {UniformBufferLayout} from './uniform-buffer-layout';
+import {log} from '../../utils/log';
+
+export type ShaderModuleInputs = {
+  uniformTypes?: Record<string, ShaderUniformType>;
+  defaultProps?: Record<string, unknown>;
+  defaultUniforms?: Record<string, UniformValue>;
+};
+
+/**
+ * A uniform store holds a uniform values for one or more uniform blocks,
+ * - It can generate binary data for any uniform buffer
+ * - It can manage a uniform buffer for each block
+ * - It can update managed uniform buffers with a single call
+ * - It performs some book keeping on what has changed to minimize unnecessary writes to uniform buffers.
+ */
+export class UniformStore<
+  TPropGroups extends Record<string, Record<string, unknown>> = Record<
+    string,
+    Record<string, unknown>
+  >
+> {
+  /** Stores the uniform values for each uniform block */
+  uniformBlocks = new Map<keyof TPropGroups, UniformBlock>();
+  /** Can generate data for a uniform buffer for each block from data */
+  uniformBufferLayouts = new Map<keyof TPropGroups, UniformBufferLayout>();
+  /** Actual buffer for the blocks */
+  uniformBuffers = new Map<keyof TPropGroups, Buffer>();
+
+  /**
+   * Create a new UniformStore instance
+   * @param blocks
+   */
+  constructor(
+    blocks: Record<
+      keyof TPropGroups,
+      {
+        uniformTypes?: Record<string, ShaderUniformType>;
+        defaultProps?: Record<string, unknown>;
+        defaultUniforms?: Record<string, UniformValue>;
+      }
+    >
+  ) {
+    for (const [bufferName, block] of Object.entries(blocks)) {
+      const uniformBufferName = bufferName as keyof TPropGroups;
+
+      // Create a layout object to help us generate correctly formatted binary uniform buffers
+      const uniformBufferLayout = new UniformBufferLayout(block.uniformTypes || {});
+      this.uniformBufferLayouts.set(uniformBufferName, uniformBufferLayout);
+
+      // Create a Uniform block to store the uniforms for each buffer.
+      const uniformBlock = new UniformBlock({name: bufferName});
+      uniformBlock.setUniforms(block.defaultUniforms || {});
+      this.uniformBlocks.set(uniformBufferName, uniformBlock);
+    }
+  }
+
+  /** Destroy any managed uniform buffers */
+  destroy(): void {
+    for (const uniformBuffer of Object.values(this.uniformBuffers)) {
+      uniformBuffer.destroy();
+    }
+  }
+
+  /**
+   * Set uniforms
+   * Makes all properties partial
+   */
+  setUniforms(
+    uniforms: Partial<{[group in keyof TPropGroups]: Partial<TPropGroups[group]>}>
+  ): void {
+    for (const [blockName, uniformValues] of Object.entries(uniforms)) {
+      this.uniformBlocks.get(blockName).setUniforms(uniformValues);
+      // We leverage logging in updateUniformBuffers(), even though slightly less efficient
+      // this.updateUniformBuffer(blockName);
+    }
+
+    this.updateUniformBuffers();
+  }
+
+  /** Get the required minimum length of the uniform buffer */
+  getUniformBufferByteLength(uniformBufferName: keyof TPropGroups): number {
+    return this.uniformBufferLayouts.get(uniformBufferName).byteLength;
+  }
+
+  /** Get formatted binary memory that can be uploaded to a buffer */
+  getUniformBufferData(uniformBufferName: keyof TPropGroups): Uint8Array {
+    const uniformValues = this.uniformBlocks.get(uniformBufferName).getAllUniforms();
+    return this.uniformBufferLayouts.get(uniformBufferName).getData(uniformValues);
+  }
+
+  /**
+   * Creates an unmanaged uniform buffer (umnanaged means that application is responsible for destroying it)
+   * The new buffer is initialized with current / supplied values
+   */
+  createUniformBuffer(
+    device: Device,
+    uniformBufferName: keyof TPropGroups,
+    uniforms?: Partial<{[group in keyof TPropGroups]: Partial<TPropGroups[group]>}>
+  ): Buffer {
+    if (uniforms) {
+      this.setUniforms(uniforms);
+    }
+    const byteLength = this.getUniformBufferByteLength(uniformBufferName);
+    const uniformBuffer = device.createBuffer({
+      usage: Buffer.UNIFORM | Buffer.COPY_DST,
+      byteLength
+    });
+    // Note that this clears the needs redraw flag
+    const uniformBufferData = this.getUniformBufferData(uniformBufferName);
+    uniformBuffer.write(uniformBufferData);
+    return uniformBuffer;
+  }
+
+  /** Get the managed uniform buffer. "managed" resources are destroyed when the uniformStore is destroyed. */
+  getManagedUniformBuffer(device: Device, uniformBufferName: keyof TPropGroups): Buffer {
+    if (!this.uniformBuffers.get(uniformBufferName)) {
+      const byteLength = this.getUniformBufferByteLength(uniformBufferName);
+      const uniformBuffer = device.createBuffer({
+        usage: Buffer.UNIFORM | Buffer.COPY_DST,
+        byteLength
+      });
+      this.uniformBuffers.set(uniformBufferName, uniformBuffer);
+    }
+    // this.updateUniformBuffers();
+    return this.uniformBuffers.get(uniformBufferName);
+  }
+
+  /** Updates all uniform buffers where values have changed */
+  updateUniformBuffers(): false | string {
+    let reason: false | string = false;
+    for (const uniformBufferName of this.uniformBlocks.keys()) {
+      const bufferReason = this.updateUniformBuffer(uniformBufferName);
+      reason ||= bufferReason;
+    }
+    if (reason) {
+      log.log(3, `UniformStore.updateUniformBuffers(): ${reason}`)();
+    }
+    return reason;
+  }
+
+  /** Update one uniform buffer. Only updates if values have changed */
+  updateUniformBuffer(uniformBufferName: keyof TPropGroups): false | string {
+    const uniformBlock = this.uniformBlocks.get(uniformBufferName);
+    const uniformBuffer = this.uniformBuffers.get(uniformBufferName);
+
+    let reason: false | string = false;
+    if (uniformBuffer && uniformBlock.needsRedraw) {
+      reason ||= uniformBlock.needsRedraw;
+      // This clears the needs redraw flag
+      const uniformBufferData = this.getUniformBufferData(uniformBufferName);
+
+      const uniformBuffer = this.uniformBuffers.get(uniformBufferName);
+      uniformBuffer.write(uniformBufferData);
+
+      // logging - TODO - don't query the values unnecessarily
+      const uniformValues = this.uniformBlocks.get(uniformBufferName).getAllUniforms();
+      log.log(
+        4,
+        `Writing to uniform buffer ${String(uniformBufferName)}`,
+        uniformBufferData,
+        uniformValues
+      )();
+    }
+    return reason;
+  }
+}

package/src/lib/uniforms/uniform.ts

@@ -0,0 +1,25 @@
+import type {UniformValue} from '../../adapter/types/types';
+import type {Binding} from '../../adapter/types/shader-layout';
+import {isNumberArray} from '../../utils/is-array';
+
+export function isUniformValue(value: unknown): boolean {
+  return isNumberArray(value) !== null || (typeof value === 'number') || (typeof value === 'boolean');
+}
+
+type UniformsAndBindings = {
+  bindings: Record<string, Binding>,
+  uniforms: Record<string, UniformValue>
+};
+export function splitUniformsAndBindings(uniforms: Record<string, Binding | UniformValue>): UniformsAndBindings {
+  const result: UniformsAndBindings = { bindings: {}, uniforms: {} } 
+  Object.keys(uniforms).forEach(name => {
+    const uniform = uniforms[name];
+    if(isUniformValue(uniform)) {
+      result.uniforms[name] = uniform as UniformValue;
+    } else {
+      result.bindings[name] = uniform as Binding;
+    }
+  });
+
+  return result;
+}

package/src/types.ts

@@ -0,0 +1,33 @@
+/** TypeScript type covering all typed arrays */
+import {TypedArray, NumberArray} from '@math.gl/types';
+
+export {TypedArray, NumberArray};
+
+/** TypeScript type covering constructors of any of the typed arrays */
+export type TypedArrayConstructor =
+  | Int8ArrayConstructor
+  | Uint8ArrayConstructor
+  | Int16ArrayConstructor
+  | Uint16ArrayConstructor
+  | Int32ArrayConstructor
+  | Uint32ArrayConstructor
+  | Uint8ClampedArrayConstructor
+  | Float32ArrayConstructor
+  | Float64ArrayConstructor;
+
+/** Keep big int arrays separate as they are still problematic, can't be indexed and don't work well on Safari */
+export type BigIntTypedArray = BigInt64Array | BigUint64Array;
+
+export type BigIntOrNumberArray = NumberArray | BigIntTypedArray;
+
+/** Get the constructor type of a type */
+export interface ConstructorOf<T> {
+  new (...args: unknown[]): T;
+}
+
+/** 
+ * Make specific fields in a type optional. Granular version of `Partial<T>` 
+ * @example 
+ *  type PartialProps = PartialBy<Required<DeviceProps>, 'device' | 'canvas'>
+ */
+export type PartialBy<T, K extends keyof T> = Omit<T, K> & Partial<Pick<T, K>>;