threejs-postprocessing

Add bloom with UnrealBloomPass inside an EffectComposer chain after a RenderPass. Configure strength, radius, and threshold parameters, then call composer.render() instead of renderer.render() in the animation loop.

Use selective bloom by assigning glowing objects to a dedicated layer, darkening all non-bloomed meshes with a black material during the bloom pass, then restoring materials and rendering the final scene on top.

FXAA is cheaper and works as a single ShaderPass with a resolution uniform, making it suitable for most cases. SMAA produces higher-quality edges but costs more; use SMAAPass when visual quality matters more than performance.

The most common cause is still calling renderer.render() instead of composer.render() in the animation loop. Also verify the RenderPass is added first in the chain and that composer.setSize() is called on window resize.

Define a shader object with a tDiffuse uniform, vertex shader, and fragment shader, then wrap it in a ShaderPass and add it to the composer. Update custom uniforms like time each frame in the animation loop.

Limit the number of passes, render bloom at half resolution, disable unused passes via the enabled flag, and prefer FXAA over MSAA. Skip expensive effects like SSAO on mobile devices detected via user agent.