Add WebGPU renderer with Canvas 2D fallback for performance

Author: rgilks

Cargo.lock

@@ -35,9 +35,13 @@ tempfile = "3.8"
 # WebAssembly support
 wasm-bindgen = "0.2"
 wasm-bindgen-rayon = "1.2"
+wasm-bindgen-futures = "0.4"
 web-sys = { version = "0.3", features = [
     "HtmlCanvasElement",
     "CanvasRenderingContext2d",
+    "Window",
+    "Document",
+    "Element",
 ] }
 serde-wasm-bindgen = "0.6"
 console_error_panic_hook = "0.1"

Cargo.toml

@@ -29,6 +29,7 @@ struct EntityData {
 pub struct WebSimulation {
     simulation: simulation::Simulation,
     config: config::SimulationConfig,
+    entity_buffer: Vec<f32>, // Reusable buffer for entity data
 }
 
 #[wasm_bindgen]
@@ -40,7 +41,11 @@ impl WebSimulation {
 
         let simulation = simulation::Simulation::new_with_config(world_size, config.clone());
 
-        Ok(WebSimulation { simulation, config })
+        Ok(WebSimulation {
+            simulation,
+            config,
+            entity_buffer: Vec::with_capacity(60000), // 10000 entities * 6 floats
+        })
     }
 
     pub fn update(&mut self) {
@@ -63,6 +68,27 @@ impl WebSimulation {
         serde_wasm_bindgen::to_value(&entities).unwrap_or(JsValue::NULL)
     }
 
+    /// Update entity buffer and return pointer for WebGPU renderer
+    pub fn update_entity_buffer(&mut self) -> *const f32 {
+        let entity_tuples = self.simulation.get_entities();
+        self.entity_buffer.clear();
+
+        for (x, y, radius, r, g, b) in entity_tuples {
+            self.entity_buffer.push(x);
+            self.entity_buffer.push(y);
+            self.entity_buffer.push(radius);
+            self.entity_buffer.push(r);
+            self.entity_buffer.push(g);
+            self.entity_buffer.push(b);
+        }
+
+        self.entity_buffer.as_ptr()
+    }
+
+    pub fn entity_count(&self) -> u32 {
+        (self.entity_buffer.len() / 6) as u32
+    }
+
     pub fn get_stats(&self) -> JsValue {
         let stats = stats::SimulationStats::from_world(
             self.simulation.world(),

src/lib.rs

@@ -1,3 +1,6 @@
+mod webgpu;
+pub use webgpu::WebGpuRenderer;
+
 use serde::{Deserialize, Serialize};
 use wasm_bindgen::prelude::*;
 use web_sys::{CanvasRenderingContext2d, HtmlCanvasElement};
@@ -12,6 +15,7 @@ struct EntityData {
     b: f32,
 }
 
+/// Legacy Canvas 2D renderer (fallback for browsers without WebGPU)
 #[wasm_bindgen]
 pub struct WebRenderer {
     ctx: CanvasRenderingContext2d,
@@ -43,24 +47,20 @@ impl WebRenderer {
 
     #[allow(deprecated)]
     pub fn render(&self, entities: &JsValue) -> Result<(), JsValue> {
-        // Parse entities from JS
         let entities: Vec<EntityData> = serde_wasm_bindgen::from_value(entities.clone())?;
 
-        // Clear canvas
         self.ctx
             .clear_rect(0.0, 0.0, self.width as f64, self.height as f64);
 
-        // Calculate center offset to center the simulation world
         let center_x = self.width as f64 / 2.0;
         let center_y = self.height as f64 / 2.0;
 
-        // Render each entity
         for entity in entities {
             self.ctx.begin_path();
             self.ctx.arc(
                 center_x + entity.x as f64,
                 center_y + entity.y as f64,
-                (entity.radius * 0.1) as f64, // Make entities 10x smaller
+                (entity.radius * 0.1) as f64,
                 0.0,
                 2.0 * std::f64::consts::PI,
             )?;