📄 `Backend.js`¶

📊 Analysis Summary¶

Metric	Count
🔧 Functions	51
🧱 Classes	1
📦 Imports	5
📊 Variables & Constants	6

📚 Table of Contents¶

Imports
Variables & Constants
Functions
Classes

🛠️ File Location:¶

📂 src/renderers/common/Backend.js

📦 Imports¶

Name	Source
`Color4`	`./Color4.js`
`Vector2`	`../../math/Vector2.js`
`createCanvasElement`	`../../utils.js`
`warnOnce`	`../../utils.js`
`REVISION`	`../../constants.js`

Variables & Constants¶

Name	Type	Kind	Value	Exported
`_vector2`	`any`	let/var	`null`	✗
`_color4`	`any`	let/var	`null`	✗
`queryPool`	`any`	let/var	`this.timestampQueryPool[ type ]`	✗
`duration`	`any`	let/var	`await queryPool.resolveQueriesAsync()`	✗
`renderer`	`Renderer`	let/var	`this.renderer`	✗
`domElement`	`HTMLCanvasElement \\| OffscreenCanvas`	let/var	`this.domElement`	✗

Functions¶

`Backend.init(renderer: Renderer): Promise<any>`¶

JSDoc:

/**
     * Initializes the backend so it is ready for usage. Concrete backends
     * are supposed to implement their rendering context creation and related
     * operations in this method.
     *
     * @async
     * @param {Renderer} renderer - The renderer.
     * @return {Promise} A Promise that resolves when the backend has been initialized.
     */

Parameters:

renderer Renderer

Returns: Promise<any>

Code

async init( renderer ) {

        this.renderer = renderer;

    }

`Backend.beginRender(): void`¶

JSDoc:

/**
     * This method is executed at the beginning of a render call and
     * can be used by the backend to prepare the state for upcoming
     * draw calls.
     *
     * @abstract
     * @param {RenderContext} renderContext - The render context.
     */

Returns: void

Code

beginRender( /*renderContext*/ ) {}

`Backend.finishRender(): void`¶

JSDoc:

/**
     * This method is executed at the end of a render call and
     * can be used by the backend to finalize work after draw
     * calls.
     *
     * @abstract
     * @param {RenderContext} renderContext - The render context.
     */

Returns: void

Code

finishRender( /*renderContext*/ ) {}

`Backend.beginCompute(): void`¶

JSDoc:

/**
     * This method is executed at the beginning of a compute call and
     * can be used by the backend to prepare the state for upcoming
     * compute tasks.
     *
     * @abstract
     * @param {Node|Array<Node>} computeGroup - The compute node(s).
     */

Returns: void

Code

beginCompute( /*computeGroup*/ ) {}

`Backend.finishCompute(): void`¶

JSDoc:

/**
     * This method is executed at the end of a compute call and
     * can be used by the backend to finalize work after compute
     * tasks.
     *
     * @abstract
     * @param {Node|Array<Node>} computeGroup - The compute node(s).
     */

Returns: void

Code

finishCompute( /*computeGroup*/ ) {}

`Backend.draw(): void`¶

JSDoc:

/**
     * Executes a draw command for the given render object.
     *
     * @abstract
     * @param {RenderObject} renderObject - The render object to draw.
     * @param {Info} info - Holds a series of statistical information about the GPU memory and the rendering process.
     */

Returns: void

Code

draw( /*renderObject, info*/ ) { }

`Backend.compute(): void`¶

JSDoc:

/**
     * Executes a compute command for the given compute node.
     *
     * @abstract
     * @param {Node|Array<Node>} computeGroup - The group of compute nodes of a compute call. Can be a single compute node.
     * @param {Node} computeNode - The compute node.
     * @param {Array<BindGroup>} bindings - The bindings.
     * @param {ComputePipeline} computePipeline - The compute pipeline.
     */

Returns: void

Code

compute( /*computeGroup, computeNode, computeBindings, computePipeline*/ ) { }

`Backend.createProgram(): void`¶

JSDoc:

/**
     * Creates a shader program from the given programmable stage.
     *
     * @abstract
     * @param {ProgrammableStage} program - The programmable stage.
     */

Returns: void

Code

createProgram( /*program*/ ) { }

`Backend.destroyProgram(): void`¶

JSDoc:

/**
     * Destroys the shader program of the given programmable stage.
     *
     * @abstract
     * @param {ProgrammableStage} program - The programmable stage.
     */

Returns: void

Code

destroyProgram( /*program*/ ) { }

`Backend.createBindings(): void`¶

JSDoc:

/**
     * Creates bindings from the given bind group definition.
     *
     * @abstract
     * @param {BindGroup} bindGroup - The bind group.
     * @param {Array<BindGroup>} bindings - Array of bind groups.
     * @param {number} cacheIndex - The cache index.
     * @param {number} version - The version.
     */

Returns: void

Code

createBindings( /*bindGroup, bindings, cacheIndex, version*/ ) { }

`Backend.updateBindings(): void`¶

JSDoc:

/**
     * Updates the given bind group definition.
     *
     * @abstract
     * @param {BindGroup} bindGroup - The bind group.
     * @param {Array<BindGroup>} bindings - Array of bind groups.
     * @param {number} cacheIndex - The cache index.
     * @param {number} version - The version.
     */

Returns: void

Code

updateBindings( /*bindGroup, bindings, cacheIndex, version*/ ) { }

`Backend.updateBinding(): void`¶

JSDoc:

/**
     * Updates a buffer binding.
     *
     * @abstract
     * @param {Buffer} binding - The buffer binding to update.
     */

Returns: void

Code

updateBinding( /*binding*/ ) { }

`Backend.createRenderPipeline(): void`¶

JSDoc:

/**
     * Creates a render pipeline for the given render object.
     *
     * @abstract
     * @param {RenderObject} renderObject - The render object.
     * @param {Array<Promise>} promises - An array of compilation promises which are used in `compileAsync()`.
     */

Returns: void

Code

createRenderPipeline( /*renderObject, promises*/ ) { }

`Backend.createComputePipeline(): void`¶

JSDoc:

/**
     * Creates a compute pipeline for the given compute node.
     *
     * @abstract
     * @param {ComputePipeline} computePipeline - The compute pipeline.
     * @param {Array<BindGroup>} bindings - The bindings.
     */

Returns: void

Code

createComputePipeline( /*computePipeline, bindings*/ ) { }

`Backend.needsRenderUpdate(): boolean`¶

JSDoc:

/**
     * Returns `true` if the render pipeline requires an update.
     *
     * @abstract
     * @param {RenderObject} renderObject - The render object.
     * @return {boolean} Whether the render pipeline requires an update or not.
     */

Returns: boolean

Code

needsRenderUpdate( /*renderObject*/ ) { }

`Backend.getRenderCacheKey(): string`¶

JSDoc:

/**
     * Returns a cache key that is used to identify render pipelines.
     *
     * @abstract
     * @param {RenderObject} renderObject - The render object.
     * @return {string} The cache key.
     */

Returns: string

Code

getRenderCacheKey( /*renderObject*/ ) { }

`Backend.createNodeBuilder(): NodeBuilder`¶

JSDoc:

/**
     * Returns a node builder for the given render object.
     *
     * @abstract
     * @param {RenderObject} renderObject - The render object.
     * @param {Renderer} renderer - The renderer.
     * @return {NodeBuilder} The node builder.
     */

Returns: NodeBuilder

Code

createNodeBuilder( /*renderObject, renderer*/ ) { }

`Backend.createSampler(): void`¶

JSDoc:

/**
     * Creates a GPU sampler for the given texture.
     *
     * @abstract
     * @param {Texture} texture - The texture to create the sampler for.
     */

Returns: void

Code

createSampler( /*texture*/ ) { }

`Backend.destroySampler(): void`¶

JSDoc:

/**
     * Destroys the GPU sampler for the given texture.
     *
     * @abstract
     * @param {Texture} texture - The texture to destroy the sampler for.
     */

Returns: void

Code

destroySampler( /*texture*/ ) {}

`Backend.createDefaultTexture(): void`¶

JSDoc:

/**
     * Creates a default texture for the given texture that can be used
     * as a placeholder until the actual texture is ready for usage.
     *
     * @abstract
     * @param {Texture} texture - The texture to create a default texture for.
     */

Returns: void

Code

createDefaultTexture( /*texture*/ ) { }

`Backend.createTexture(): void`¶

JSDoc:

/**
     * Defines a texture on the GPU for the given texture object.
     *
     * @abstract
     * @param {Texture} texture - The texture.
     * @param {Object} [options={}] - Optional configuration parameter.
     */

Returns: void

Code

createTexture( /*texture, options={}*/ ) { }

`Backend.updateTexture(): void`¶

JSDoc:

/**
     * Uploads the updated texture data to the GPU.
     *
     * @abstract
     * @param {Texture} texture - The texture.
     * @param {Object} [options={}] - Optional configuration parameter.
     */

Returns: void

Code

updateTexture( /*texture, options = {}*/ ) { }

`Backend.generateMipmaps(): void`¶

JSDoc:

/**
     * Generates mipmaps for the given texture.
     *
     * @abstract
     * @param {Texture} texture - The texture.
     */

Returns: void

Code

generateMipmaps( /*texture*/ ) { }

`Backend.destroyTexture(): void`¶

JSDoc:

/**
     * Destroys the GPU data for the given texture object.
     *
     * @abstract
     * @param {Texture} texture - The texture.
     */

Returns: void

Code

destroyTexture( /*texture*/ ) { }

`Backend.copyTextureToBuffer(): Promise<TypedArray>`¶

JSDoc:

/**
     * Returns texture data as a typed array.
     *
     * @abstract
     * @async
     * @param {Texture} texture - The texture to copy.
     * @param {number} x - The x coordinate of the copy origin.
     * @param {number} y - The y coordinate of the copy origin.
     * @param {number} width - The width of the copy.
     * @param {number} height - The height of the copy.
     * @param {number} faceIndex - The face index.
     * @return {Promise<TypedArray>} A Promise that resolves with a typed array when the copy operation has finished.
     */

Returns: Promise<TypedArray>

Code

async copyTextureToBuffer( /*texture, x, y, width, height, faceIndex*/ ) {}

`Backend.copyTextureToTexture(): void`¶

JSDoc:

/**
     * Copies data of the given source texture to the given destination texture.
     *
     * @abstract
     * @param {Texture} srcTexture - The source texture.
     * @param {Texture} dstTexture - The destination texture.
     * @param {?(Box3|Box2)} [srcRegion=null] - The region of the source texture to copy.
     * @param {?(Vector2|Vector3)} [dstPosition=null] - The destination position of the copy.
     * @param {number} [srcLevel=0] - The source mip level to copy from.
     * @param {number} [dstLevel=0] - The destination mip level to copy to.
     */

Returns: void

Code

copyTextureToTexture( /*srcTexture, dstTexture, srcRegion = null, dstPosition = null, srcLevel = 0, dstLevel = 0*/ ) {}

`Backend.copyFramebufferToTexture(): void`¶

JSDoc:

/**
    * Copies the current bound framebuffer to the given texture.
    *
    * @abstract
    * @param {Texture} texture - The destination texture.
    * @param {RenderContext} renderContext - The render context.
    * @param {Vector4} rectangle - A four dimensional vector defining the origin and dimension of the copy.
    */

Returns: void

Code

copyFramebufferToTexture( /*texture, renderContext, rectangle*/ ) {}

`Backend.createAttribute(): void`¶

JSDoc:

/**
     * Creates the GPU buffer of a shader attribute.
     *
     * @abstract
     * @param {BufferAttribute} attribute - The buffer attribute.
     */

Returns: void

Code

createAttribute( /*attribute*/ ) { }

`Backend.createIndexAttribute(): void`¶

JSDoc:

/**
     * Creates the GPU buffer of an indexed shader attribute.
     *
     * @abstract
     * @param {BufferAttribute} attribute - The indexed buffer attribute.
     */

Returns: void

Code

createIndexAttribute( /*attribute*/ ) { }

`Backend.createStorageAttribute(): void`¶

JSDoc:

/**
     * Creates the GPU buffer of a storage attribute.
     *
     * @abstract
     * @param {BufferAttribute} attribute - The buffer attribute.
     */

Returns: void

Code

createStorageAttribute( /*attribute*/ ) { }

`Backend.updateAttribute(): void`¶

JSDoc:

/**
     * Updates the GPU buffer of a shader attribute.
     *
     * @abstract
     * @param {BufferAttribute} attribute - The buffer attribute to update.
     */

Returns: void

Code

updateAttribute( /*attribute*/ ) { }

`Backend.destroyAttribute(): void`¶

JSDoc:

/**
     * Destroys the GPU buffer of a shader attribute.
     *
     * @abstract
     * @param {BufferAttribute} attribute - The buffer attribute to destroy.
     */

Returns: void

Code

destroyAttribute( /*attribute*/ ) { }

`Backend.getContext(): any`¶

JSDoc:

/**
     * Returns the backend's rendering context.
     *
     * @abstract
     * @return {Object} The rendering context.
     */

Returns: any

Code

getContext() { }

`Backend.updateSize(): void`¶

JSDoc:

/**
     * Backends can use this method if they have to run
     * logic when the renderer gets resized.
     *
     * @abstract
     */

Returns: void

Code

updateSize() { }

`Backend.updateViewport(): void`¶

JSDoc:

/**
     * Updates the viewport with the values from the given render context.
     *
     * @abstract
     * @param {RenderContext} renderContext - The render context.
     */

Returns: void

Code

updateViewport( /*renderContext*/ ) {}

`Backend.isOccluded(): boolean`¶

JSDoc:

/**
     * Returns `true` if the given 3D object is fully occluded by other
     * 3D objects in the scene. Backends must implement this method by using
     * a Occlusion Query API.
     *
     * @abstract
     * @param {RenderContext} renderContext - The render context.
     * @param {Object3D} object - The 3D object to test.
     * @return {boolean} Whether the 3D object is fully occluded or not.
     */

Returns: boolean

Code

isOccluded( /*renderContext, object*/ ) {}

`Backend.resolveTimestampsAsync(type: string): Promise<number>`¶

JSDoc:

/**
     * Resolves the time stamp for the given render context and type.
     *
     * @async
     * @abstract
     * @param {string} [type='render'] - The type of the time stamp.
     * @return {Promise<number>} A Promise that resolves with the time stamp.
     */

Parameters:

type string

Returns: Promise<number>

Calls:

warnOnce (from ../../utils.js)
queryPool.resolveQueriesAsync

Code

async resolveTimestampsAsync( type = 'render' ) {

        if ( ! this.trackTimestamp ) {

            warnOnce( 'WebGPURenderer: Timestamp tracking is disabled.' );
            return;

        }

        const queryPool = this.timestampQueryPool[ type ];
        if ( ! queryPool ) {

            warnOnce( `WebGPURenderer: No timestamp query pool for type '${type}' found.` );
            return;

        }

        const duration = await queryPool.resolveQueriesAsync();

        this.renderer.info[ type ].timestamp = duration;

        return duration;

    }

`Backend.waitForGPU(): Promise<any>`¶

JSDoc:

/**
     * Can be used to synchronize CPU operations with GPU tasks. So when this method is called,
     * the CPU waits for the GPU to complete its operation (e.g. a compute task).
     *
     * @async
     * @abstract
     * @return {Promise} A Promise that resolves when synchronization has been finished.
     */

Returns: Promise<any>

Code

async waitForGPU() {}

`Backend.getArrayBufferAsync(): Promise<ArrayBuffer>`¶

JSDoc:

/**
     * This method performs a readback operation by moving buffer data from
     * a storage buffer attribute from the GPU to the CPU.
     *
     * @async
     * @param {StorageBufferAttribute} attribute - The storage buffer attribute.
     * @return {Promise<ArrayBuffer>} A promise that resolves with the buffer data when the data are ready.
     */

Returns: Promise<ArrayBuffer>

Code

async getArrayBufferAsync( /* attribute */ ) {}

`Backend.hasFeatureAsync(): Promise<boolean>`¶

JSDoc:

/**
     * Checks if the given feature is supported by the backend.
     *
     * @async
     * @abstract
     * @param {string} name - The feature's name.
     * @return {Promise<boolean>} A Promise that resolves with a bool that indicates whether the feature is supported or not.
     */

Returns: Promise<boolean>

Code

async hasFeatureAsync( /*name*/ ) { }

`Backend.hasFeature(): boolean`¶

JSDoc:

/**
     * Checks if the given feature is supported  by the backend.
     *
     * @abstract
     * @param {string} name - The feature's name.
     * @return {boolean} Whether the feature is supported or not.
     */

Returns: boolean

Code

hasFeature( /*name*/ ) {}

`Backend.getMaxAnisotropy(): number`¶

JSDoc:

/**
     * Returns the maximum anisotropy texture filtering value.
     *
     * @abstract
     * @return {number} The maximum anisotropy texture filtering value.
     */

Returns: number

Code

getMaxAnisotropy() {}

`Backend.getDrawingBufferSize(): Vector2`¶

JSDoc:

/**
     * Returns the drawing buffer size.
     *
     * @return {Vector2} The drawing buffer size.
     */

Returns: Vector2

Calls:

this.renderer.getDrawingBufferSize

Code

getDrawingBufferSize() {

        _vector2 = _vector2 || new Vector2();

        return this.renderer.getDrawingBufferSize( _vector2 );

    }

`Backend.setScissorTest(): void`¶

JSDoc:

/**
     * Defines the scissor test.
     *
     * @abstract
     * @param {boolean} boolean - Whether the scissor test should be enabled or not.
     */

Returns: void

Code

setScissorTest( /*boolean*/ ) { }

`Backend.getClearColor(): Color4`¶

JSDoc:

/**
     * Returns the clear color and alpha into a single
     * color object.
     *
     * @return {Color4} The clear color.
     */

Returns: Color4

Calls:

renderer.getClearColor
_color4.getRGB

Code

getClearColor() {

        const renderer = this.renderer;

        _color4 = _color4 || new Color4();

        renderer.getClearColor( _color4 );

        _color4.getRGB( _color4 );

        return _color4;

    }

`Backend.getDomElement(): HTMLCanvasElement`¶

JSDoc:

/**
     * Returns the DOM element. If no DOM element exists, the backend
     * creates a new one.
     *
     * @return {HTMLCanvasElement} The DOM element.
     */

Returns: HTMLCanvasElement

Calls:

createCanvasElement (from ../../utils.js)
domElement.setAttribute

Internal Comments:

// OffscreenCanvas does not have setAttribute, see #22811

Code

getDomElement() {

        let domElement = this.domElement;

        if ( domElement === null ) {

            domElement = ( this.parameters.canvas !== undefined ) ? this.parameters.canvas : createCanvasElement();

            // OffscreenCanvas does not have setAttribute, see #22811
            if ( 'setAttribute' in domElement ) domElement.setAttribute( 'data-engine', `three.js r${REVISION} webgpu` );

            this.domElement = domElement;

        }

        return domElement;

    }

`Backend.set(object: any, value: any): void`¶

JSDoc:

/**
     * Sets a dictionary for the given object into the
     * internal data structure.
     *
     * @param {Object} object - The object.
     * @param {Object} value - The dictionary to set.
     */

Parameters:

object any
value any

Returns: void

Calls:

this.data.set

Code

set( object, value ) {

        this.data.set( object, value );

    }

`Backend.get(object: any): any`¶

JSDoc:

/**
     * Returns the dictionary for the given object.
     *
     * @param {Object} object - The object.
     * @return {Object} The object's dictionary.
     */

Parameters:

object any

Returns: any

Calls:

this.data.get
this.data.set

Code

get( object ) {

        let map = this.data.get( object );

        if ( map === undefined ) {

            map = {};
            this.data.set( object, map );

        }

        return map;

    }

`Backend.has(object: any): boolean`¶

JSDoc:

/**
     * Checks if the given object has a dictionary
     * with data defined.
     *
     * @param {Object} object - The object.
     * @return {boolean} Whether a dictionary for the given object as been defined or not.
     */

Parameters:

object any

Returns: boolean

Calls:

this.data.has

Code

has( object ) {

        return this.data.has( object );

    }

`Backend.delete(object: any): void`¶

JSDoc:

/**
     * Deletes an object from the internal data structure.
     *
     * @param {Object} object - The object to delete.
     */

Parameters:

object any

Returns: void

Calls:

this.data.delete

Code

delete( object ) {

        this.data.delete( object );

    }

`Backend.dispose(): void`¶

JSDoc:

/**
     * Frees internal resources.
     *
     * @abstract
     */

Returns: void

Code

dispose() { }

Classes¶

`Backend`¶

Class Code

class Backend {

    /**
     * Constructs a new backend.
     *
     * @param {Object} parameters - An object holding parameters for the backend.
     */
    constructor( parameters = {} ) {

        /**
         * The parameters of the backend.
         *
         * @type {Object}
         */
        this.parameters = Object.assign( {}, parameters );

        /**
         * This weak map holds backend-specific data of objects
         * like textures, attributes or render targets.
         *
         * @type {WeakMap}
         */
        this.data = new WeakMap();

        /**
         * A reference to the renderer.
         *
         * @type {?Renderer}
         * @default null
         */
        this.renderer = null;

        /**
         * A reference to the canvas element the renderer is drawing to.
         *
         * @type {?(HTMLCanvasElement|OffscreenCanvas)}
         * @default null
         */
        this.domElement = null;

        /**
         * A reference to the timestamp query pool.
         *
         * @type {{render: ?TimestampQueryPool, compute: ?TimestampQueryPool}}
         */
        this.timestampQueryPool = {
            'render': null,
            'compute': null
        };

        /**
         * Whether to track timestamps with a Timestamp Query API or not.
         *
         * @type {boolean}
         * @default false
         */
        this.trackTimestamp = ( parameters.trackTimestamp === true );

    }

    /**
     * Initializes the backend so it is ready for usage. Concrete backends
     * are supposed to implement their rendering context creation and related
     * operations in this method.
     *
     * @async
     * @param {Renderer} renderer - The renderer.
     * @return {Promise} A Promise that resolves when the backend has been initialized.
     */
    async init( renderer ) {

        this.renderer = renderer;

    }

    /**
     * The coordinate system of the backend.
     *
     * @abstract
     * @type {number}
     * @readonly
     */
    get coordinateSystem() {}

    // render context

    /**
     * This method is executed at the beginning of a render call and
     * can be used by the backend to prepare the state for upcoming
     * draw calls.
     *
     * @abstract
     * @param {RenderContext} renderContext - The render context.
     */
    beginRender( /*renderContext*/ ) {}

    /**
     * This method is executed at the end of a render call and
     * can be used by the backend to finalize work after draw
     * calls.
     *
     * @abstract
     * @param {RenderContext} renderContext - The render context.
     */
    finishRender( /*renderContext*/ ) {}

    /**
     * This method is executed at the beginning of a compute call and
     * can be used by the backend to prepare the state for upcoming
     * compute tasks.
     *
     * @abstract
     * @param {Node|Array<Node>} computeGroup - The compute node(s).
     */
    beginCompute( /*computeGroup*/ ) {}

    /**
     * This method is executed at the end of a compute call and
     * can be used by the backend to finalize work after compute
     * tasks.
     *
     * @abstract
     * @param {Node|Array<Node>} computeGroup - The compute node(s).
     */
    finishCompute( /*computeGroup*/ ) {}

    // render object

    /**
     * Executes a draw command for the given render object.
     *
     * @abstract
     * @param {RenderObject} renderObject - The render object to draw.
     * @param {Info} info - Holds a series of statistical information about the GPU memory and the rendering process.
     */
    draw( /*renderObject, info*/ ) { }

    // compute node

    /**
     * Executes a compute command for the given compute node.
     *
     * @abstract
     * @param {Node|Array<Node>} computeGroup - The group of compute nodes of a compute call. Can be a single compute node.
     * @param {Node} computeNode - The compute node.
     * @param {Array<BindGroup>} bindings - The bindings.
     * @param {ComputePipeline} computePipeline - The compute pipeline.
     */
    compute( /*computeGroup, computeNode, computeBindings, computePipeline*/ ) { }

    // program

    /**
     * Creates a shader program from the given programmable stage.
     *
     * @abstract
     * @param {ProgrammableStage} program - The programmable stage.
     */
    createProgram( /*program*/ ) { }

    /**
     * Destroys the shader program of the given programmable stage.
     *
     * @abstract
     * @param {ProgrammableStage} program - The programmable stage.
     */
    destroyProgram( /*program*/ ) { }

    // bindings

    /**
     * Creates bindings from the given bind group definition.
     *
     * @abstract
     * @param {BindGroup} bindGroup - The bind group.
     * @param {Array<BindGroup>} bindings - Array of bind groups.
     * @param {number} cacheIndex - The cache index.
     * @param {number} version - The version.
     */
    createBindings( /*bindGroup, bindings, cacheIndex, version*/ ) { }

    /**
     * Updates the given bind group definition.
     *
     * @abstract
     * @param {BindGroup} bindGroup - The bind group.
     * @param {Array<BindGroup>} bindings - Array of bind groups.
     * @param {number} cacheIndex - The cache index.
     * @param {number} version - The version.
     */
    updateBindings( /*bindGroup, bindings, cacheIndex, version*/ ) { }

    /**
     * Updates a buffer binding.
     *
     * @abstract
     * @param {Buffer} binding - The buffer binding to update.
     */
    updateBinding( /*binding*/ ) { }

    // pipeline

    /**
     * Creates a render pipeline for the given render object.
     *
     * @abstract
     * @param {RenderObject} renderObject - The render object.
     * @param {Array<Promise>} promises - An array of compilation promises which are used in `compileAsync()`.
     */
    createRenderPipeline( /*renderObject, promises*/ ) { }

    /**
     * Creates a compute pipeline for the given compute node.
     *
     * @abstract
     * @param {ComputePipeline} computePipeline - The compute pipeline.
     * @param {Array<BindGroup>} bindings - The bindings.
     */
    createComputePipeline( /*computePipeline, bindings*/ ) { }

    // cache key

    /**
     * Returns `true` if the render pipeline requires an update.
     *
     * @abstract
     * @param {RenderObject} renderObject - The render object.
     * @return {boolean} Whether the render pipeline requires an update or not.
     */
    needsRenderUpdate( /*renderObject*/ ) { }

    /**
     * Returns a cache key that is used to identify render pipelines.
     *
     * @abstract
     * @param {RenderObject} renderObject - The render object.
     * @return {string} The cache key.
     */
    getRenderCacheKey( /*renderObject*/ ) { }

    // node builder

    /**
     * Returns a node builder for the given render object.
     *
     * @abstract
     * @param {RenderObject} renderObject - The render object.
     * @param {Renderer} renderer - The renderer.
     * @return {NodeBuilder} The node builder.
     */
    createNodeBuilder( /*renderObject, renderer*/ ) { }

    // textures

    /**
     * Creates a GPU sampler for the given texture.
     *
     * @abstract
     * @param {Texture} texture - The texture to create the sampler for.
     */
    createSampler( /*texture*/ ) { }

    /**
     * Destroys the GPU sampler for the given texture.
     *
     * @abstract
     * @param {Texture} texture - The texture to destroy the sampler for.
     */
    destroySampler( /*texture*/ ) {}

    /**
     * Creates a default texture for the given texture that can be used
     * as a placeholder until the actual texture is ready for usage.
     *
     * @abstract
     * @param {Texture} texture - The texture to create a default texture for.
     */
    createDefaultTexture( /*texture*/ ) { }

    /**
     * Defines a texture on the GPU for the given texture object.
     *
     * @abstract
     * @param {Texture} texture - The texture.
     * @param {Object} [options={}] - Optional configuration parameter.
     */
    createTexture( /*texture, options={}*/ ) { }

    /**
     * Uploads the updated texture data to the GPU.
     *
     * @abstract
     * @param {Texture} texture - The texture.
     * @param {Object} [options={}] - Optional configuration parameter.
     */
    updateTexture( /*texture, options = {}*/ ) { }

    /**
     * Generates mipmaps for the given texture.
     *
     * @abstract
     * @param {Texture} texture - The texture.
     */
    generateMipmaps( /*texture*/ ) { }

    /**
     * Destroys the GPU data for the given texture object.
     *
     * @abstract
     * @param {Texture} texture - The texture.
     */
    destroyTexture( /*texture*/ ) { }

    /**
     * Returns texture data as a typed array.
     *
     * @abstract
     * @async
     * @param {Texture} texture - The texture to copy.
     * @param {number} x - The x coordinate of the copy origin.
     * @param {number} y - The y coordinate of the copy origin.
     * @param {number} width - The width of the copy.
     * @param {number} height - The height of the copy.
     * @param {number} faceIndex - The face index.
     * @return {Promise<TypedArray>} A Promise that resolves with a typed array when the copy operation has finished.
     */
    async copyTextureToBuffer( /*texture, x, y, width, height, faceIndex*/ ) {}

    /**
     * Copies data of the given source texture to the given destination texture.
     *
     * @abstract
     * @param {Texture} srcTexture - The source texture.
     * @param {Texture} dstTexture - The destination texture.
     * @param {?(Box3|Box2)} [srcRegion=null] - The region of the source texture to copy.
     * @param {?(Vector2|Vector3)} [dstPosition=null] - The destination position of the copy.
     * @param {number} [srcLevel=0] - The source mip level to copy from.
     * @param {number} [dstLevel=0] - The destination mip level to copy to.
     */
    copyTextureToTexture( /*srcTexture, dstTexture, srcRegion = null, dstPosition = null, srcLevel = 0, dstLevel = 0*/ ) {}

    /**
    * Copies the current bound framebuffer to the given texture.
    *
    * @abstract
    * @param {Texture} texture - The destination texture.
    * @param {RenderContext} renderContext - The render context.
    * @param {Vector4} rectangle - A four dimensional vector defining the origin and dimension of the copy.
    */
    copyFramebufferToTexture( /*texture, renderContext, rectangle*/ ) {}

    // attributes

    /**
     * Creates the GPU buffer of a shader attribute.
     *
     * @abstract
     * @param {BufferAttribute} attribute - The buffer attribute.
     */
    createAttribute( /*attribute*/ ) { }

    /**
     * Creates the GPU buffer of an indexed shader attribute.
     *
     * @abstract
     * @param {BufferAttribute} attribute - The indexed buffer attribute.
     */
    createIndexAttribute( /*attribute*/ ) { }

    /**
     * Creates the GPU buffer of a storage attribute.
     *
     * @abstract
     * @param {BufferAttribute} attribute - The buffer attribute.
     */
    createStorageAttribute( /*attribute*/ ) { }

    /**
     * Updates the GPU buffer of a shader attribute.
     *
     * @abstract
     * @param {BufferAttribute} attribute - The buffer attribute to update.
     */
    updateAttribute( /*attribute*/ ) { }

    /**
     * Destroys the GPU buffer of a shader attribute.
     *
     * @abstract
     * @param {BufferAttribute} attribute - The buffer attribute to destroy.
     */
    destroyAttribute( /*attribute*/ ) { }

    // canvas

    /**
     * Returns the backend's rendering context.
     *
     * @abstract
     * @return {Object} The rendering context.
     */
    getContext() { }

    /**
     * Backends can use this method if they have to run
     * logic when the renderer gets resized.
     *
     * @abstract
     */
    updateSize() { }

    /**
     * Updates the viewport with the values from the given render context.
     *
     * @abstract
     * @param {RenderContext} renderContext - The render context.
     */
    updateViewport( /*renderContext*/ ) {}

    // utils

    /**
     * Returns `true` if the given 3D object is fully occluded by other
     * 3D objects in the scene. Backends must implement this method by using
     * a Occlusion Query API.
     *
     * @abstract
     * @param {RenderContext} renderContext - The render context.
     * @param {Object3D} object - The 3D object to test.
     * @return {boolean} Whether the 3D object is fully occluded or not.
     */
    isOccluded( /*renderContext, object*/ ) {}

    /**
     * Resolves the time stamp for the given render context and type.
     *
     * @async
     * @abstract
     * @param {string} [type='render'] - The type of the time stamp.
     * @return {Promise<number>} A Promise that resolves with the time stamp.
     */
    async resolveTimestampsAsync( type = 'render' ) {

        if ( ! this.trackTimestamp ) {

            warnOnce( 'WebGPURenderer: Timestamp tracking is disabled.' );
            return;

        }

        const queryPool = this.timestampQueryPool[ type ];
        if ( ! queryPool ) {

            warnOnce( `WebGPURenderer: No timestamp query pool for type '${type}' found.` );
            return;

        }

        const duration = await queryPool.resolveQueriesAsync();

        this.renderer.info[ type ].timestamp = duration;

        return duration;

    }

    /**
     * Can be used to synchronize CPU operations with GPU tasks. So when this method is called,
     * the CPU waits for the GPU to complete its operation (e.g. a compute task).
     *
     * @async
     * @abstract
     * @return {Promise} A Promise that resolves when synchronization has been finished.
     */
    async waitForGPU() {}

    /**
     * This method performs a readback operation by moving buffer data from
     * a storage buffer attribute from the GPU to the CPU.
     *
     * @async
     * @param {StorageBufferAttribute} attribute - The storage buffer attribute.
     * @return {Promise<ArrayBuffer>} A promise that resolves with the buffer data when the data are ready.
     */
    async getArrayBufferAsync( /* attribute */ ) {}

    /**
     * Checks if the given feature is supported by the backend.
     *
     * @async
     * @abstract
     * @param {string} name - The feature's name.
     * @return {Promise<boolean>} A Promise that resolves with a bool that indicates whether the feature is supported or not.
     */
    async hasFeatureAsync( /*name*/ ) { }

    /**
     * Checks if the given feature is supported  by the backend.
     *
     * @abstract
     * @param {string} name - The feature's name.
     * @return {boolean} Whether the feature is supported or not.
     */
    hasFeature( /*name*/ ) {}

    /**
     * Returns the maximum anisotropy texture filtering value.
     *
     * @abstract
     * @return {number} The maximum anisotropy texture filtering value.
     */
    getMaxAnisotropy() {}

    /**
     * Returns the drawing buffer size.
     *
     * @return {Vector2} The drawing buffer size.
     */
    getDrawingBufferSize() {

        _vector2 = _vector2 || new Vector2();

        return this.renderer.getDrawingBufferSize( _vector2 );

    }

    /**
     * Defines the scissor test.
     *
     * @abstract
     * @param {boolean} boolean - Whether the scissor test should be enabled or not.
     */
    setScissorTest( /*boolean*/ ) { }

    /**
     * Returns the clear color and alpha into a single
     * color object.
     *
     * @return {Color4} The clear color.
     */
    getClearColor() {

        const renderer = this.renderer;

        _color4 = _color4 || new Color4();

        renderer.getClearColor( _color4 );

        _color4.getRGB( _color4 );

        return _color4;

    }

    /**
     * Returns the DOM element. If no DOM element exists, the backend
     * creates a new one.
     *
     * @return {HTMLCanvasElement} The DOM element.
     */
    getDomElement() {

        let domElement = this.domElement;

        if ( domElement === null ) {

            domElement = ( this.parameters.canvas !== undefined ) ? this.parameters.canvas : createCanvasElement();

            // OffscreenCanvas does not have setAttribute, see #22811
            if ( 'setAttribute' in domElement ) domElement.setAttribute( 'data-engine', `three.js r${REVISION} webgpu` );

            this.domElement = domElement;

        }

        return domElement;

    }

    /**
     * Sets a dictionary for the given object into the
     * internal data structure.
     *
     * @param {Object} object - The object.
     * @param {Object} value - The dictionary to set.
     */
    set( object, value ) {

        this.data.set( object, value );

    }

    /**
     * Returns the dictionary for the given object.
     *
     * @param {Object} object - The object.
     * @return {Object} The object's dictionary.
     */
    get( object ) {

        let map = this.data.get( object );

        if ( map === undefined ) {

            map = {};
            this.data.set( object, map );

        }

        return map;

    }

    /**
     * Checks if the given object has a dictionary
     * with data defined.
     *
     * @param {Object} object - The object.
     * @return {boolean} Whether a dictionary for the given object as been defined or not.
     */
    has( object ) {

        return this.data.has( object );

    }

    /**
     * Deletes an object from the internal data structure.
     *
     * @param {Object} object - The object to delete.
     */
    delete( object ) {

        this.data.delete( object );

    }

    /**
     * Frees internal resources.
     *
     * @abstract
     */
    dispose() { }

}

Methods¶

`init(renderer: Renderer): Promise<any>`¶

Code

async init( renderer ) {

        this.renderer = renderer;

    }

`beginRender(): void`¶

Code

beginRender( /*renderContext*/ ) {}

`finishRender(): void`¶

Code

finishRender( /*renderContext*/ ) {}

`beginCompute(): void`¶

Code

beginCompute( /*computeGroup*/ ) {}

`finishCompute(): void`¶

Code

finishCompute( /*computeGroup*/ ) {}

`draw(): void`¶

Code

draw( /*renderObject, info*/ ) { }

`compute(): void`¶

Code

compute( /*computeGroup, computeNode, computeBindings, computePipeline*/ ) { }

`createProgram(): void`¶

Code

createProgram( /*program*/ ) { }

`destroyProgram(): void`¶

Code

destroyProgram( /*program*/ ) { }

`createBindings(): void`¶

Code

createBindings( /*bindGroup, bindings, cacheIndex, version*/ ) { }

`updateBindings(): void`¶

Code

updateBindings( /*bindGroup, bindings, cacheIndex, version*/ ) { }

`updateBinding(): void`¶

Code

updateBinding( /*binding*/ ) { }

`createRenderPipeline(): void`¶

Code

createRenderPipeline( /*renderObject, promises*/ ) { }

`createComputePipeline(): void`¶

Code

createComputePipeline( /*computePipeline, bindings*/ ) { }

`needsRenderUpdate(): boolean`¶

Code

needsRenderUpdate( /*renderObject*/ ) { }

`getRenderCacheKey(): string`¶

Code

getRenderCacheKey( /*renderObject*/ ) { }

`createNodeBuilder(): NodeBuilder`¶

Code

createNodeBuilder( /*renderObject, renderer*/ ) { }

`createSampler(): void`¶

Code

createSampler( /*texture*/ ) { }

`destroySampler(): void`¶

Code

destroySampler( /*texture*/ ) {}

`createDefaultTexture(): void`¶

Code

createDefaultTexture( /*texture*/ ) { }

`createTexture(): void`¶

Code

createTexture( /*texture, options={}*/ ) { }

`updateTexture(): void`¶

Code

updateTexture( /*texture, options = {}*/ ) { }

`generateMipmaps(): void`¶

Code

generateMipmaps( /*texture*/ ) { }

`destroyTexture(): void`¶

Code

destroyTexture( /*texture*/ ) { }

`copyTextureToBuffer(): Promise<TypedArray>`¶

Code

async copyTextureToBuffer( /*texture, x, y, width, height, faceIndex*/ ) {}

`copyTextureToTexture(): void`¶

Code

copyTextureToTexture( /*srcTexture, dstTexture, srcRegion = null, dstPosition = null, srcLevel = 0, dstLevel = 0*/ ) {}

`copyFramebufferToTexture(): void`¶

Code

copyFramebufferToTexture( /*texture, renderContext, rectangle*/ ) {}

`createAttribute(): void`¶

Code

createAttribute( /*attribute*/ ) { }

`createIndexAttribute(): void`¶

Code

createIndexAttribute( /*attribute*/ ) { }

`createStorageAttribute(): void`¶

Code

createStorageAttribute( /*attribute*/ ) { }

`updateAttribute(): void`¶

Code

updateAttribute( /*attribute*/ ) { }

`destroyAttribute(): void`¶

Code

destroyAttribute( /*attribute*/ ) { }

`getContext(): any`¶

Code

getContext() { }

`updateSize(): void`¶

Code

updateSize() { }

`updateViewport(): void`¶

Code

updateViewport( /*renderContext*/ ) {}

`isOccluded(): boolean`¶

Code

isOccluded( /*renderContext, object*/ ) {}

`resolveTimestampsAsync(type: string): Promise<number>`¶

Code

async resolveTimestampsAsync( type = 'render' ) {

        if ( ! this.trackTimestamp ) {

            warnOnce( 'WebGPURenderer: Timestamp tracking is disabled.' );
            return;

        }

        const queryPool = this.timestampQueryPool[ type ];
        if ( ! queryPool ) {

            warnOnce( `WebGPURenderer: No timestamp query pool for type '${type}' found.` );
            return;

        }

        const duration = await queryPool.resolveQueriesAsync();

        this.renderer.info[ type ].timestamp = duration;

        return duration;

    }

`waitForGPU(): Promise<any>`¶

Code

async waitForGPU() {}

`getArrayBufferAsync(): Promise<ArrayBuffer>`¶

Code

async getArrayBufferAsync( /* attribute */ ) {}

`hasFeatureAsync(): Promise<boolean>`¶

Code

async hasFeatureAsync( /*name*/ ) { }

`hasFeature(): boolean`¶

Code

hasFeature( /*name*/ ) {}

`getMaxAnisotropy(): number`¶

Code

getMaxAnisotropy() {}

`getDrawingBufferSize(): Vector2`¶

Code

getDrawingBufferSize() {

        _vector2 = _vector2 || new Vector2();

        return this.renderer.getDrawingBufferSize( _vector2 );

    }

`setScissorTest(): void`¶

Code

setScissorTest( /*boolean*/ ) { }

`getClearColor(): Color4`¶

Code

getClearColor() {

        const renderer = this.renderer;

        _color4 = _color4 || new Color4();

        renderer.getClearColor( _color4 );

        _color4.getRGB( _color4 );

        return _color4;

    }

`getDomElement(): HTMLCanvasElement`¶

Code

getDomElement() {

        let domElement = this.domElement;

        if ( domElement === null ) {

            domElement = ( this.parameters.canvas !== undefined ) ? this.parameters.canvas : createCanvasElement();

            // OffscreenCanvas does not have setAttribute, see #22811
            if ( 'setAttribute' in domElement ) domElement.setAttribute( 'data-engine', `three.js r${REVISION} webgpu` );

            this.domElement = domElement;

        }

        return domElement;

    }

`set(object: any, value: any): void`¶

Code

set( object, value ) {

        this.data.set( object, value );

    }

`get(object: any): any`¶

Code

get( object ) {

        let map = this.data.get( object );

        if ( map === undefined ) {

            map = {};
            this.data.set( object, map );

        }

        return map;

    }

`has(object: any): boolean`¶

Code

has( object ) {

        return this.data.has( object );

    }

`delete(object: any): void`¶

Code

delete( object ) {

        this.data.delete( object );

    }

`dispose(): void`¶

Code

dispose() { }

📄 Backend.js¶

📊 Analysis Summary¶

📚 Table of Contents¶

🛠️ File Location:¶

📦 Imports¶

Variables & Constants¶

Functions¶

Backend.init(renderer: Renderer): Promise<any>¶

Backend.beginRender(): void¶

Backend.finishRender(): void¶

Backend.beginCompute(): void¶

Backend.finishCompute(): void¶

Backend.draw(): void¶

Backend.compute(): void¶

Backend.createProgram(): void¶

Backend.destroyProgram(): void¶

Backend.createBindings(): void¶

Backend.updateBindings(): void¶

Backend.updateBinding(): void¶

Backend.createRenderPipeline(): void¶

Backend.createComputePipeline(): void¶

Backend.needsRenderUpdate(): boolean¶

Backend.getRenderCacheKey(): string¶

Backend.createNodeBuilder(): NodeBuilder¶

Backend.createSampler(): void¶

Backend.destroySampler(): void¶

Backend.createDefaultTexture(): void¶

Backend.createTexture(): void¶

Backend.updateTexture(): void¶

Backend.generateMipmaps(): void¶

Backend.destroyTexture(): void¶

Backend.copyTextureToBuffer(): Promise<TypedArray>¶

Backend.copyTextureToTexture(): void¶

Backend.copyFramebufferToTexture(): void¶

Backend.createAttribute(): void¶

Backend.createIndexAttribute(): void¶

Backend.createStorageAttribute(): void¶

Backend.updateAttribute(): void¶

Backend.destroyAttribute(): void¶

Backend.getContext(): any¶

Backend.updateSize(): void¶

Backend.updateViewport(): void¶

Backend.isOccluded(): boolean¶

Backend.resolveTimestampsAsync(type: string): Promise<number>¶

Backend.waitForGPU(): Promise<any>¶

Backend.getArrayBufferAsync(): Promise<ArrayBuffer>¶

Backend.hasFeatureAsync(): Promise<boolean>¶

Backend.hasFeature(): boolean¶

Backend.getMaxAnisotropy(): number¶

Backend.getDrawingBufferSize(): Vector2¶

Backend.setScissorTest(): void¶

Backend.getClearColor(): Color4¶

Backend.getDomElement(): HTMLCanvasElement¶

Backend.set(object: any, value: any): void¶

Backend.get(object: any): any¶

Backend.has(object: any): boolean¶

Backend.delete(object: any): void¶

Backend.dispose(): void¶

Classes¶

Backend¶

Methods¶

init(renderer: Renderer): Promise<any>¶

beginRender(): void¶

finishRender(): void¶

beginCompute(): void¶

finishCompute(): void¶

draw(): void¶

compute(): void¶

createProgram(): void¶

destroyProgram(): void¶

createBindings(): void¶

updateBindings(): void¶

updateBinding(): void¶

createRenderPipeline(): void¶

createComputePipeline(): void¶

needsRenderUpdate(): boolean¶

getRenderCacheKey(): string¶

createNodeBuilder(): NodeBuilder¶

createSampler(): void¶

destroySampler(): void¶

📄 `Backend.js`¶

`Backend.init(renderer: Renderer): Promise<any>`¶

`Backend.beginRender(): void`¶

`Backend.finishRender(): void`¶

`Backend.beginCompute(): void`¶

`Backend.finishCompute(): void`¶

`Backend.draw(): void`¶

`Backend.compute(): void`¶

`Backend.createProgram(): void`¶

`Backend.destroyProgram(): void`¶

`Backend.createBindings(): void`¶

`Backend.updateBindings(): void`¶

`Backend.updateBinding(): void`¶

`Backend.createRenderPipeline(): void`¶

`Backend.createComputePipeline(): void`¶

`Backend.needsRenderUpdate(): boolean`¶

`Backend.getRenderCacheKey(): string`¶

`Backend.createNodeBuilder(): NodeBuilder`¶

`Backend.createSampler(): void`¶

`Backend.destroySampler(): void`¶

`Backend.createDefaultTexture(): void`¶

`Backend.createTexture(): void`¶

`Backend.updateTexture(): void`¶

`Backend.generateMipmaps(): void`¶

`Backend.destroyTexture(): void`¶

`Backend.copyTextureToBuffer(): Promise<TypedArray>`¶

`Backend.copyTextureToTexture(): void`¶

`Backend.copyFramebufferToTexture(): void`¶

`Backend.createAttribute(): void`¶

`Backend.createIndexAttribute(): void`¶

`Backend.createStorageAttribute(): void`¶

`Backend.updateAttribute(): void`¶

`Backend.destroyAttribute(): void`¶

`Backend.getContext(): any`¶

`Backend.updateSize(): void`¶

`Backend.updateViewport(): void`¶

`Backend.isOccluded(): boolean`¶

`Backend.resolveTimestampsAsync(type: string): Promise<number>`¶

`Backend.waitForGPU(): Promise<any>`¶

`Backend.getArrayBufferAsync(): Promise<ArrayBuffer>`¶

`Backend.hasFeatureAsync(): Promise<boolean>`¶

`Backend.hasFeature(): boolean`¶

`Backend.getMaxAnisotropy(): number`¶

`Backend.getDrawingBufferSize(): Vector2`¶

`Backend.setScissorTest(): void`¶

`Backend.getClearColor(): Color4`¶

`Backend.getDomElement(): HTMLCanvasElement`¶

`Backend.set(object: any, value: any): void`¶

`Backend.get(object: any): any`¶

`Backend.has(object: any): boolean`¶

`Backend.delete(object: any): void`¶

`Backend.dispose(): void`¶

`Backend`¶

`init(renderer: Renderer): Promise<any>`¶

`beginRender(): void`¶

`finishRender(): void`¶

`beginCompute(): void`¶

`finishCompute(): void`¶

`draw(): void`¶

`compute(): void`¶

`createProgram(): void`¶

`destroyProgram(): void`¶

`createBindings(): void`¶

`updateBindings(): void`¶

`updateBinding(): void`¶

`createRenderPipeline(): void`¶

`createComputePipeline(): void`¶

`needsRenderUpdate(): boolean`¶

`getRenderCacheKey(): string`¶

`createNodeBuilder(): NodeBuilder`¶

`createSampler(): void`¶

`destroySampler(): void`¶

`createDefaultTexture(): void`¶

`createTexture(): void`¶

`updateTexture(): void`¶

`generateMipmaps(): void`¶

`destroyTexture(): void`¶

`copyTextureToBuffer(): Promise<TypedArray>`¶

`copyTextureToTexture(): void`¶

`copyFramebufferToTexture(): void`¶