quadRenderPass()

function quadRenderPass<
  Context extends UniformContext = UniformContext,
  U extends UniformSources<Context> = UniformSources<Context>,
>(params: {
  vertex?: string;
  gl?: WebGL2RenderingContext;
  target?: RenderTarget | null;
  fragment: string;
  attributes?: Record<string, Attribute>;
  blending?: "none" | "normal" | "additive";
  depthTest?: boolean;
  drawMode?:
    | "POINTS"
    | "LINES"
    | "LINE_STRIP"
    | "LINE_LOOP"
    | "TRIANGLES"
    | "TRIANGLE_STRIP"
    | "TRIANGLE_FAN";
  transformFeedbackVaryings?: string[];
  resolutionScale?: number;
  uniforms?: U;
}): RenderPass<U, UniformContext>;

Creates a render pass that renders a full-screen quad (actually a single large triangle for performance reasons; see pmndrs/postprocessing and GCN execution patterns).

This is used for direct full-screen rendering. It is also the geometry primitive used by post-processing effects.

Uniform sources can be concrete values, functions, promises, or media descriptors. Use effectPass() or glCanvas() for post-processing pipelines and canvas lifecycle management.

Type Parameters

Context

Context extends UniformContext = UniformContext

U

U extends UniformSources<Context> = UniformSources<Context>

Parameters

params

Configuration for the quad render pass.

vertex?

string

Optional vertex shader. If omitted, the built-in full-screen triangle vertex shader is used and its UV varying is adapted to the fragment shader.

gl?

WebGL2RenderingContext

Optional WebGL2 context used to initialize the pass immediately.

Passes without a context are initialized by calling pass.initialize(gl) or using the compositor. Calling initialize() multiple times with the same context is a no-op.

target?

| RenderTarget | null

Optional initial render target for the pass. If not provided, it will render directly to the canvas or can be set later.

fragment

string

Fragment shader source code.

attributes?

Record<string, Attribute> = {}

Mapping of attribute names to their data and configuration.

blending?

"none" | "normal" | "additive"

Blending mode to use for this pass.

Default

"none";

depthTest?

boolean

Whether to enable depth testing.

Default

false;

drawMode?

| "POINTS" | "LINES" | "LINE_STRIP" | "LINE_LOOP" | "TRIANGLES" | "TRIANGLE_STRIP" | "TRIANGLE_FAN"

WebGL draw mode.

Default

"POINTS" if gl_PointSize is found in the vertex shader, otherwise "TRIANGLES".

transformFeedbackVaryings?

string[]

Array of varying names for Transform Feedback.

resolutionScale?

number

Scaling factor applied to the resolution when the pass is resized.

Default

1;

uniforms?

U

Uniform values, synchronous functions, promises, or media descriptors.

Returns

RenderPass<U, UniformContext>