Depth sorting and backface culling!

Author: Sekqies

src/rendering/depth_sorting.ts

@@ -0,0 +1,27 @@
+import type { Mesh } from "./mesh";
+
+
+export function depth_sort(mesh: Mesh, stride: number = 4): number {
+    const projected = mesh.projected_buffer;
+    const raster = mesh.raster_buffer;
+    const indices = mesh.indices;
+    const num_triangles = indices.length / 3;
+    let visible_count = 0;
+
+    for (let i = 0; i < num_triangles; i++) {
+        const i0 = indices[i * 3] * stride;
+        const i1 = indices[i * 3 + 1] * stride;
+        const i2 = indices[i * 3 + 2] * stride;
+        
+        const z_avg = (projected[i0 + 2] + projected[i1 + 2] + projected[i2 + 2]) / 3;
+    
+        raster[i] = z_avg; 
+        mesh.draw_order[visible_count] = i; 
+        visible_count++;
+    }
+
+    const active_order = mesh.draw_order.subarray(0, visible_count);
+    active_order.sort((a, b) => raster[b] - raster[a]);
+
+    return visible_count;
+}

src/rendering/mesh.ts

@@ -6,14 +6,18 @@ export class Mesh{
     indices: IndexingType
     projected_buffer: ArrayType
     raster_buffer: ArrayType
+    draw_order:IndexingType
     raster_end:number
+    visible_triangles_count:number
 
     constructor(vertices:ArrayType, indices:IndexingType){
         this.vertices = vertices;
         this.indices = indices;
         this.projected_buffer = new ArrayType(vertices.length * 4 / 3);
         this.raster_buffer = new ArrayType(indices.length * 4);
+        this.draw_order = new IndexingType(indices.length);
         this.raster_end = indices.length * 4;
+        this.visible_triangles_count = 0;
     }
 
 }

src/rendering/primitive_assembler.ts

@@ -1,27 +1,40 @@
-import { ArrayType } from "../math/types";
+import { depth_sort } from "./depth_sorting";
 import type { Mesh } from "./mesh";
 
 /**
  * 
  * @param mesh Mutated
  * @param stride 
  */
-export function assemble_primitives(mesh:Mesh, stride:number = 4):void{
-    const vertices = mesh.projected_buffer;
+export function assemble_primitives(mesh:Mesh):void{
+    const visible_count = depth_sort(mesh);
+    const projected = mesh.projected_buffer;
     const indices = mesh.indices;
-    const required_space = indices.length * stride;
-    if (mesh.raster_buffer.length < required_space){
-        console.warn("Resizing the raster buffer's out - this generally shouldn't happen");
-        mesh.raster_buffer = new ArrayType(required_space);
-    }
+    const order = mesh.draw_order;
+
     const out = mesh.raster_buffer
     let out_index = 0;
-    for(let i = 0; i < indices.length; ++i){
-        const index = indices[i];
-        const start = index * stride;
+    for(let i = 0; i < visible_count; ++i){
+        const index = order[i];
+
+        const v1 = indices[index * 3] * 4;
+        const v2 = indices[index * 3 + 1] * 4;
+        const v3 = indices[index * 3 + 2] * 4;
 
-        for(let k = 0; k < stride; ++k){
-            out[out_index++] = vertices[start + k];
-        }
+        out[out_index++] = projected[v1];
+        out[out_index++] = projected[v1 + 1];
+        out[out_index++] = projected[v1 + 2];
+        out[out_index++] = projected[v1 + 3];
+
+        out[out_index++] = projected[v2];
+        out[out_index++] = projected[v2 + 1];
+        out[out_index++] = projected[v2 + 2];
+        out[out_index++] = projected[v2 + 3];
+
+        out[out_index++] = projected[v3];
+        out[out_index++] = projected[v3 + 1];
+        out[out_index++] = projected[v3 + 2];
+        out[out_index++] = projected[v3 + 3];
     }
+    mesh.visible_triangles_count = visible_count;
 }

src/rendering/rasterizer.ts

@@ -2,7 +2,6 @@ import { vec3, vec4 } from "../math/types";
 import type { Mesh } from "./mesh";
 import { process_perspective_mutate} from "./vertex";
 
-
 /**
  * 
  * @param mesh (Mutated)
@@ -26,7 +25,7 @@ export function rasterize(mesh:Mesh, invert_y:boolean = true, stride:number = 4)
     let n2 = vec3(0,0,0);
     let n3 = vec3(0,0,0);
 
-    for(let i = 0; i < num_triangles; ++i){
+    for(let i = 0; i < mesh.visible_triangles_count; ++i){
         const base = 3 * i * stride;
         c1[0] = vertices[base + 0]; c1[1] = vertices[base + 1]; c1[2] = vertices[base + 2]; c1[3] = vertices[base + 3];
         c2[0] = vertices[base + stride + 0]; c2[1] = vertices[base + stride + 1]; c2[2] = vertices[base + stride + 2]; c2[3] = vertices[base + stride + 3];
@@ -36,18 +35,34 @@ export function rasterize(mesh:Mesh, invert_y:boolean = true, stride:number = 4)
         const v2 = process_perspective_mutate(c2, n2);
         const v3 = process_perspective_mutate(c3, n3);
 
+        const x1 = n1[0];
+        const y1 = n1[1] * sign; 
+        
+        const x2 = n2[0];
+        const y2 = n2[1] * sign;
+        
+        const x3 = n3[0];
+        const y3 = n3[1] * sign;
+
+        const area = (x2 - x1) * (y3 - y1) - (y2 - y1) * (x3 - x1);
+
+        if (area <= 0) {
+            continue; 
+        }
+
         if(!v1 || !v2 || !v3){
             continue;
         }
 
-        out[out_index++] = n1[0];
-        out[out_index++] = sign * n1[1];
+        out[out_index++] = x1;
+        out[out_index++] = y1;
 
-        out[out_index++] = n2[0];
-        out[out_index++] = sign * n2[1];
+        out[out_index++] = x2;
+        out[out_index++] = y2;
 
-        out[out_index++] = n3[0];
-        out[out_index++] = sign * n3[1];
+        out[out_index++] = x3;
+        out[out_index++] = y3;
     }
     mesh.raster_end = out_index;
-}
+}
+

src/rendering/render.ts

@@ -10,7 +10,7 @@ import type { StringBuffer } from "../utils/string_buffer";
 export function render(mesh: Mesh, model:mat4, view:mat4, projection:mat4, invert_y:boolean = true, stride:number = 4):void {
     const mvp = mul_mat4(mul_mat4(projection,view),model);
     transform_vertices(mesh,mvp);
-    assemble_primitives(mesh,stride);
+    assemble_primitives(mesh);
     rasterize(mesh, invert_y, stride);
 }