Skip to main content
Version: Phaser v4.0.0

WebGLProgramWrapper

Wraps a WebGL shader program, which is the GPU-side program compiled from a vertex shader and a fragment shader. Together, these shaders define how geometry is transformed and how each pixel within that geometry is colored. Every pipeline in Phaser's WebGL renderer is backed by a WebGLProgramWrapper.

Beyond holding the compiled program, this wrapper manages the full lifecycle of the associated WebGL resources: it tracks vertex attribute locations and layout, stores uniform values, and queues uniform update requests that are applied lazily when the program is bound for drawing.

The raw WebGLProgram object should never be used or stored directly outside of the WebGLRenderer. By routing all access through this wrapper, the renderer can transparently handle WebGL context loss and restoration — recreating the underlying program and re-applying all state — without any other system needing to be aware of it. Always use WebGLProgramWrapper instead of holding a direct WebGLProgram reference.

Constructor

new WebGLProgramWrapper(renderer, vertexSource, fragmentSource)

Parameters

nametypeoptionaldescription
rendererPhaser.Renderer.WebGL.WebGLRendererNoThe WebGLRenderer instance that owns this wrapper.
vertexSourcestringNoThe vertex shader source code as a string.
fragmentSourcestringNoThe fragment shader source code as a string.

Scope: static

Source: src/renderer/webgl/wrappers/WebGLProgramWrapper.js#L26
Since: 3.80.0

Public Members

compileTimeMs

compileTimeMs: number

Description:

The time taken to compile this program, in milliseconds.

Source: src/renderer/webgl/wrappers/WebGLProgramWrapper.js#L106
Since: 4.0.0


compiling

compiling: boolean

Description:

Whether this program is currently being compiled. This will always be false, unless parallel shader compilation is enabled via config.render.skipUnreadyShaders.

Source: src/renderer/webgl/wrappers/WebGLProgramWrapper.js#L82
Since: 4.0.0


fragmentSource

fragmentSource: string

Description:

The fragment shader source code as a string.

Source: src/renderer/webgl/wrappers/WebGLProgramWrapper.js#L136
Since: 3.80.0


glAttributeBuffer

glAttributeBuffer: WebGLBuffer

Description:

The buffer which this program is using for its attributes.

Source: src/renderer/webgl/wrappers/WebGLProgramWrapper.js#L188
Since: 4.0.0


glAttributeNames

glAttributeNames: Map.<string, number>

Description:

Map of attribute names to their indexes in glAttributes.

Source: src/renderer/webgl/wrappers/WebGLProgramWrapper.js#L179
Since: 4.0.0


glAttributes

glAttributes: Array.<{location: GLint, name: string, size: number, type: GLenum}>

Description:

The attribute state of this program.

These represent the actual state in WebGL, and are only updated when the program is used to draw.

Source: src/renderer/webgl/wrappers/WebGLProgramWrapper.js#L167
Since: 4.0.0


glState

glState: Phaser.Types.Renderer.WebGL.WebGLGlobalParameters

Description:

The WebGL state necessary to bind this program.

This is used internally to accelerate state changes.

Source: src/renderer/webgl/wrappers/WebGLProgramWrapper.js#L116
Since: 4.0.0


glUniforms

glUniforms: Map.<string, Phaser.Types.Renderer.WebGL.WebGLUniform>

Description:

The uniform state of this program.

These represent the actual state in WebGL, and are only updated when the program is used to draw.

Source: src/renderer/webgl/wrappers/WebGLProgramWrapper.js#L198
Since: 4.0.0


renderer

renderer: Phaser.Renderer.WebGL.WebGLRenderer

Description:

The WebGLRenderer instance that owns this wrapper.

Source: src/renderer/webgl/wrappers/WebGLProgramWrapper.js#L59
Since: 4.0.0


uniformRequests

uniformRequests: Map.<string, any>

Description:

Requests to update the uniform state. Set a request by name to a new value. These are only processed when the program is used to draw.

Source: src/renderer/webgl/wrappers/WebGLProgramWrapper.js#L210
Since: 4.0.0


vertexSource

vertexSource: string

Description:

The vertex shader source code as a string.

Source: src/renderer/webgl/wrappers/WebGLProgramWrapper.js#L127
Since: 3.80.0


webGLProgram

webGLProgram: WebGLProgram

Description:

The WebGLProgram being wrapped by this class.

This property could change at any time. Therefore, you should never store a reference to this value. It should only be passed directly to the WebGL API for drawing.

Source: src/renderer/webgl/wrappers/WebGLProgramWrapper.js#L68
Since: 3.80.0


Public Methods

bind

<instance> bind()

Description:

Set this program as the active program in the WebGL context, then process all pending uniform update requests that were queued via setUniform. Each request is applied to the GPU and the queue is cleared, so only values that have actually changed are sent to WebGL.

Source: src/renderer/webgl/wrappers/WebGLProgramWrapper.js#L441
Since: 4.0.0


checkParallelCompile

<instance> checkParallelCompile()

Description:

Poll shader compilation status, and complete the program if it is ready. This is only called if skipUnreadyShaders is enabled and the KHR_parallel_shader_compile extension is available.

Source: src/renderer/webgl/wrappers/WebGLProgramWrapper.js#L290
Since: 4.0.0


createResource

<instance> createResource()

Description:

Creates a WebGLProgram from the given vertex and fragment shaders.

This is called automatically by the constructor. It may also be called again if the WebGLProgram needs re-creating.

Source: src/renderer/webgl/wrappers/WebGLProgramWrapper.js#L224
Since: 3.80.0


destroy

<instance> destroy()

Description:

Destroys this WebGLProgramWrapper and releases all associated WebGL resources.

If the context is not lost, this deletes the vertex shader, fragment shader, and the linked WebGLProgram from the GPU, and disables all vertex attribute arrays used by this program. The uniform map, attribute map, and any pending uniform requests are also cleared. All internal references are then nulled so this wrapper can be safely garbage-collected.

Source: src/renderer/webgl/wrappers/WebGLProgramWrapper.js#L543
Since: 3.80.0


setUniform

<instance> setUniform(name, value)

Description:

Set a uniform value for this WebGLProgram.

This method doesn't set the WebGL value directly. Instead, it adds a request to the uniformRequests map. These requests are processed when the program is used to draw.

Parameters:

nametypeoptionaldescription
namestringNoThe name of the uniform.
valuenumber | Array.<number>Int32ArrayFloat32Array

Source: src/renderer/webgl/wrappers/WebGLProgramWrapper.js#L424
Since: 4.0.0