WebGPU-Forward-Plus-and-Clustered-Deferred

WebGPUReal-Time Rendering
WebGPU-Forward-Plus-and-Clustered-Deferred

Overview

WebGPU Real-Time Renderer with Forward+ and Clustered Deferred Shading. A high-performance real-time rendering engine built with WebGPU, implementing advanced lighting techniques including Forward+, Clustered Deferred, and Naive Forward shading. The renderer efficiently handles thousands of dynamic point lights in the Sponza Atrium scene using GPU compute shaders for 3D light clustering.

Description

Developed a WebGPU-based real-time renderer that implements three rendering pipelines: Naive Forward, Forward+, and Clustered Deferred shading. The project tackles the classic challenge of efficiently rendering scenes with a large number of dynamic lights by leveraging modern GPU compute capabilities.

The core innovation lies in the 3D light clustering system implemented via compute shaders, which subdivides the camera frustum into clusters and assigns lights to each cluster based on sphere-AABB intersection tests. This allows the fragment shader to evaluate only the lights that affect each pixel's cluster, dramatically reducing redundant lighting calculations.

Clustered Deferred shading achieves the best performance by decoupling geometry and lighting passes through a G-buffer storing world position, normals, and albedo. This enables efficient parallelization of the lighting pass across screen pixels, maintaining 60+ FPS even with 4000 dynamic point lights.

  • Implemented 3D frustum-based light clustering using GPU compute shaders with configurable cluster dimensions
  • Built G-buffer system with multiple render targets (position, normal, albedo) for deferred shading pipeline
  • Developed sphere-AABB intersection algorithm for efficient light-to-cluster assignment in view space
  • Achieved 200+ FPS with 500 lights and 60+ FPS with 4000 lights using Clustered Deferred rendering
  • Created fullscreen lighting pass that samples G-buffer and applies per-cluster light evaluation
  • Integrated real-time performance comparison between Naive, Forward+, and Clustered Deferred methods
  • Utilized WebGPU's modern GPU API with bind groups, storage buffers, and compute pipelines
  • Rendered complex Sponza Atrium scene with dynamic camera controls and hundreds of animated point lights

    YK