Base renderer class, that could technically be used to render compute passes and draw fullscreen quads, even tho it is strongly advised to use at least the GPUCameraRenderer class instead. A renderer is responsible for:

  • Setting a GPUCanvasContext | context
  • Handling the HTMLCanvasElement | canvas onto everything is drawn
  • Creating a RenderPass that will handle our render and depth textures and the render pass descriptor
  • Keeping track of every specific class objects created relative to computing and rendering
  • Creating a Scene class that will take care of the rendering process of all previously mentioned objects

Hierarchy (view full)

Constructors

Properties

type: string

The type of the GPURenderer

uuid: string

The universal unique id of this GPURenderer

deviceManager: GPUDeviceManager

The GPUDeviceManager used to create this GPURenderer

canvas: HTMLCanvasElement

HTMLCanvasElement onto everything is drawn

context: GPUCanvasContext

The WebGPU GPUCanvasContext | context used

alphaMode?: GPUCanvasAlphaMode

Set the GPUCanvasContext | context alpha mode

Options used to create this GPURenderer

renderPass: RenderPass

The render pass used to render our result to screen

postProcessingPass: RenderPass

Additional render pass used by ShaderPass for compositing / post processing. Does not handle depth

scene: Scene

The Scene used

shouldRender: boolean

Whether we should render our GPURenderer or not. If set to false, the render hooks onBeforeCommandEncoderCreation, onBeforeRenderScene, onAfterRenderScene and onAfterCommandEncoderSubmission won't be called, the scene graph will not be updated and the scene will not be rendered, completely pausing the renderer. Default to true.

shouldRenderScene: boolean

Whether we should explicitly update our Scene or not. If set to false, the scene graph will not be updated and the scene will not be rendered. Default to true.

computePasses: ComputePass[]

An array containing all our created ComputePass

pingPongPlanes: PingPongPlane[]

An array containing all our created PingPongPlane

shaderPasses: ShaderPass[]

An array containing all our created ShaderPass

renderTargets: RenderTarget[]

An array containing all our created RenderTarget

An array containing all our created meshes

textures: Texture[]

An array containing all our created Texture

pixelRatio: number

Pixel ratio to use for rendering

rectBBox: RectBBox

An object defining the width, height, top and left position of the canvas. Mainly used internally. If you need to get the renderer dimensions, use boundingRect instead.

domElement: DOMElement

DOMElement that will track our canvas container size

onBeforeCommandEncoderCreation: TasksQueueManager

Allow to add callbacks to be executed at each render before the GPUCommandEncoder is created

onBeforeRenderScene: TasksQueueManager

Allow to add callbacks to be executed at each render after the GPUCommandEncoder has been created but before the Scene is rendered

onAfterRenderScene: TasksQueueManager

Allow to add callbacks to be executed at each render after the GPUCommandEncoder has been created and after the Scene has been rendered

onAfterCommandEncoderSubmission: TasksQueueManager

Allow to add callbacks to be executed at each render after the Scene has been rendered and the GPUCommandEncoder has been submitted

_onResizeCallback: (() => void) = ...

function assigned to the resizeObjects callback

Type declaration

    • (): void
    • function assigned to the resizeObjects callback

      Returns void

_onAfterResizeCallback: (() => void) = ...

function assigned to the onAfterResize callback

Type declaration

    • (): void
    • function assigned to the onAfterResize callback

      Returns void

Accessors

Methods

  • Write to a GPUBuffer

    Parameters

    • buffer: GPUBuffer

      GPUBuffer to write to

    • bufferOffset: number

      GPUSize64 | buffer offset

    • data: BufferSource

      BufferSource | data to write

    Returns void

  • Copy a source Buffer GPUBuffer into a destination Buffer GPUBuffer

    Parameters

    • parameters: {
          srcBuffer: Buffer;
          dstBuffer?: Buffer;
          commandEncoder?: GPUCommandEncoder;
      }

      parameters used to realize the copy

      • srcBuffer: Buffer

        source Buffer

      • Optional dstBuffer?: Buffer

        destination Buffer. Will create a new one if none provided.

      • Optional commandEncoder?: GPUCommandEncoder

        GPUCommandEncoder to use for the copy. Will create a new one and submit the command buffer if none provided.

    Returns Buffer

    • destination Buffer after copy
  • Create a GPUBindGroupLayout

    Parameters

    • bindGroupLayoutDescriptor: GPUBindGroupLayoutDescriptor

      GPUBindGroupLayoutDescriptor | GPU bind group layout descriptor

    Returns GPUBindGroupLayout

    • newly created GPUBindGroupLayout
  • Create a GPUBindGroup

    Parameters

    • bindGroupDescriptor: GPUBindGroupDescriptor

      GPUBindGroupDescriptor | GPU bind group descriptor

    Returns GPUBindGroup

    • newly created GPUBindGroup
  • Create a GPUShaderModule

    Parameters

    • shaderModuleDescriptor: GPUShaderModuleDescriptor

      shader module descriptor

    Returns GPUShaderModule

    • newly created GPUShaderModule
  • Create a GPUPipelineLayout

    Parameters

    • pipelineLayoutDescriptor: GPUPipelineLayoutDescriptor

      GPUPipelineLayoutDescriptor | GPU pipeline layout descriptor

    Returns GPUPipelineLayout

    • newly created GPUPipelineLayout
  • Create a GPURenderPipeline

    Parameters

    • pipelineDescriptor: GPURenderPipelineDescriptor

      GPURenderPipelineDescriptor | GPU render pipeline descriptor

    Returns GPURenderPipeline

    • newly created GPURenderPipeline
  • Asynchronously create a GPURenderPipeline

    Parameters

    • pipelineDescriptor: GPURenderPipelineDescriptor

      GPURenderPipelineDescriptor | GPU render pipeline descriptor

    Returns Promise<GPURenderPipeline>

    • newly created GPURenderPipeline

    Async

  • Create a GPUComputePipeline

    Parameters

    • pipelineDescriptor: GPUComputePipelineDescriptor

      GPUComputePipelineDescriptor | GPU compute pipeline descriptor

    Returns GPUComputePipeline

    • newly created GPUComputePipeline
  • Asynchronously create a GPUComputePipeline

    Parameters

    • pipelineDescriptor: GPUComputePipelineDescriptor

      GPUComputePipelineDescriptor | GPU compute pipeline descriptor

    Returns Promise<GPUComputePipeline>

    • newly created GPUComputePipeline

    Async

  • Create a GPUTexture

    Parameters

    • textureDescriptor: GPUTextureDescriptor

      GPUTextureDescriptor | GPU texture descriptor

    Returns GPUTexture

    • newly created GPUTexture
  • Import a GPUExternalTexture

    Parameters

    • video: HTMLVideoElement

      HTMLVideoElement source

    Returns GPUExternalTexture

    • GPUExternalTexture
  • Called at each draw call to render our scene and its content

    Parameters

    • commandEncoder: GPUCommandEncoder

      current GPUCommandEncoder

    Returns void