Chapter 551: FullScreenQuad

Core Idea

This module is a helper for passes which need to render a full screen effect which is quite common in context of post processing.

The intended usage is to reuse a single full screen quad for rendering subsequent passes by just reassigning the material reference.

This module can only be used with WebGLRenderer.

Key Concepts

• material : Material: The quad's material.

Code Examples

import { FullScreenQuad } from 'three/addons/postprocessing/Pass.js';

• What it demonstrates: Typical usage of FullScreenQuad.

Reference Tables

Constructor

Signature
new FullScreenQuad( material : Material )

Properties

Property	Description
.material : Material	The quad's material.

Methods

Method	Description
.dispose()	Frees the GPU-related resources allocated by this instance. Call this method whenever the instance is no longer used in your app.
.render( renderer : WebGLRenderer )	Renders the full screen quad.

Key Takeaways

1. FullScreenQuad extends: EventDispatcher → Object3D → Mesh
2. Most relevant properties: material.
3. Key methods: dispose, render.

Connects To

• EventDispatcher: parent class
• Object3D: parent class
• Mesh: parent class
• Source: examples/jsm/postprocessing/Pass.js