power2d

What problem does it solve?

GPU-accelerated 2D rendering for web apps, enabling complex visuals with thousands of shapes using Babylon.js and WebGPU. It provides a pixel-space pipeline with shader-based coordinate transforms and supports code-generated materials for body and stroke rendering.

Core Features & Use Cases

• GPU-accelerated styled shapes with optional stroke outlines and thin instancing for large scene counts.
• Code-generated materials (body and stroke) that work with WebGL and WebGPU backends and enable high-performance rendering.
• Pixel-space coordinates with a pixelToNDC shader transform; easy composition in 2D scenes; scene helpers like createPower2DScene and CanvasTexture for integration.
• Use cases include interactive data visualizations, generative art, dashboards, and UI overlays requiring many shapes rendered efficiently.

Quick Start

Install and import the power2d library, initialize a 2D scene with createPower2DScene, create a StyledShape using CirclePts or RectPts, assign a generated material, and animate by updating transform properties (x, y, rotation) each frame.