WebGPU Cloth Simulation 08 - WebGPU Collision Detection & Response Optimization - Part 3

Simple Collision Detection and Response Optimization for WebGPU Cloth Simulation (Mass Spring System)

1. Optimizing collision detection and handing between vertices and triangles.

    a. Collision Detection

To optimize collision detection in the vertex_triangle_intersection_shader, we modify the main function to process every third vertex instead of every vertex. This reduces the number of checks and can improve performance.

@compute @workgroup_size(16, 16, 1)

fn main(@builtin(global_invocation_id) global_id: vec3<u32>) {

    let x: u32 = global_id.x * 3; // Process every 3rd vertex

    let y: u32 = global_id.y;

    b. Collision Response

Similarly, we modify the response function to process every third vertex. This optimization continues to reduce the computational load by handling fewer vertices.

@compute @workgroup_size(256)

fn response(@builtin(global_invocation_id) global_id: vec3<u32>) {

    let x: u32 = global_id.x * 3; // Process every 3rd vertex

2. Optimizing collision handing between triangles.

To optimize collision handling between triangles, we modify the main function in the tritriIntersectionShader to process every third triangle. This change will improve performance by reducing the number of intersection checks.

@compute @workgroup_size(16, 16, 1)

fn main(@builtin(global_invocation_id) global_id: vec3<u32>) {

    let x: u32 = global_id.x * 3; // Process every 3rd vertex

    let y: u32 = global_id.y;

3. Result:

    a. Before Optimization

        MS: 30 - 40 MS per frame

        FPS: 26 - 32 FPS

    b. After Optimization

        MS: 17 - 21 MS per frame

        FPS: 50 - 56 FPS