rapid-render 1.0.13 → 1.0.15

package/README.md

@@ -3,7 +3,7 @@
 </p>
 
 <p align="center">
-  A stateless, high-performance WebGL 2D renderer for browser games.
+  A Immediate-mode, high-performance WebGL 2D renderer for browser games.
 </p>
 
 <p align="center">
@@ -20,7 +20,9 @@
 
 ## What is Rapid?
 
-Rapid is a focused WebGL 2D rendering engine for games and visual tools. lightweight at just **67 kB** (**~20 kB gzipped**) It handles the rendering layer while leaving your game architecture, update loop, and state management fully in your hands.
+Rapid is a focused WebGL 2D rendering engine for games and visual tools. lightweight just **69 kB** (**~20 kB gzipped**) and handles only the rendering layer, leaving your game architecture entirely in your hands.
+
+If you don't want your renderer to dictate how your game is organized, Rapid.js is for you!
 
 ## Highlights
 
@@ -31,7 +33,7 @@ Rapid is a focused WebGL 2D rendering engine for games and visual tools. lightwe
   Add sprite and geometry effects through shader hooks while still using Rapid's normal renderer, transforms, textures, and draw APIs.
 
 - **Flexible transforms**  
-  Fast, flexible, matrix-powered transforms for motion and hierarchies. Retain the matrix tree after traversal; local changes update only affected subtrees. No rebuild required.
+  Fast, flexible, matrix-powered transforms for motion and hierarchies. **Retain the matrix tree after traversal**; local changes update only affected subtrees. No rebuild required.
 
 - **A complete 2D toolkit**  
   Draw sprites, lines, masks, particles, render textures, text, and custom geometry from one compact WebGL renderer.
@@ -49,19 +51,91 @@ import { Rapid, Color } from "rapid-render";
 
 const canvas = document.querySelector("canvas")!;
 const rapid = new Rapid({canvas});
+const texture = await rapid.texture.load("./image/sprite.png")
 
 rapid.clear();
-rapid.drawRect({
-   x: 40,
-   y: 40,
-   width: 160,
-   height: 96,
-   color: new Color(84, 184, 234),
+rapid.drawSprite({
+    texture: texture,
+    x: 40,
+    y: 40,
 });
 rapid.flush();
 ```
 
-Next step: <a href="https://nightre.github.io/Rapid.js/docs.html">Docs</a>
+## Render a scene
+
+Expressing complex game hierarchies doesn't require `DisplayObject` trees. `rapid.matrixStack` brings the familiar, intuitive `save()` and `restore()` flow from Canvas 2D into high-performance WebGL, letting you compose parent-child relationships with zero object allocation.
+
+```ts
+// root
+// ├── world
+// │   ├── player
+// │   └── enemies
+// │       ├── enemy #0
+// │       ├── enemy #1
+// │       └── ...
+// └── ui
+
+const stack = rapid.matrixStack;
+// 1.root
+stack.save();
+    stack.translate(0, 0);
+    // 2.world
+    stack.save();
+        rapid.drawSprite(player); // player
+        // 3.enemies
+        stack.save();
+            for (let i = 0; i < 2; i++) {
+                stack.translate(x, y);
+                rapid.drawSprite(enemies[i]); // enemy
+            }
+        stack.restore(); // 3.enemies
+    stack.restore(); // 2.world
+stack.restore(); // 1.root
+// ui
+rapid.drawSprite(ui);
+```
+
+## Reuse and Update Matrix Subtrees
+
+`rapid.matrixStack` does not sacrifice the flexibility of a retained scene graph. Use `customMatrix` to render with any matrix in the hierarchy(even after its stack scope has been popped)
+
+When you modify a node's local matrix, call `updateMatrixSubtree()` to automatically recalculate that node and all affected descendant world matrices, without rebuilding the entire matrix hierarchy.
+
+```ts
+rapid.clear();
+
+const stack = rapid.matrixStack;
+const matrix = rapid.matrix;
+
+// Build a transform hierarchy.
+const world = stack.save();
+stack.translate(200, 200);
+
+const enemyNode = stack.save();
+stack.translate(80, 0);
+
+stack.restore(); // enemyNode
+stack.restore(); // world
+
+// Both nodes have been popped, but their matrices remain available.
+// Move the world node later in the same frame.
+matrix.identity(world.local);
+matrix.translate(world.local, 100, 100);
+
+// Recalculate only `world` and its descendants.
+stack.updateMatrixSubtree(world);
+
+// Render using the stored matrix of the popped child node.
+rapid.drawSprite({
+  texture: enemy,
+  customMatrix: enemyNode.world,
+});
+
+rapid.flush();
+```
+
+For more information about matrix transformations, see the [Transformations](https://nightre.github.io/Rapid.js/docs.html#transformations).
 
 ## Benchmark
 

package/dist/particle.d.ts

@@ -121,6 +121,7 @@ export declare class ParticleEmitter {
     scaleY: DynamicArrayBuffer;
     rotation: DynamicArrayBuffer;
     color: DynamicArrayBuffer;
+    private remainingLife;
     animations: {
         speed: ParticleAttributeStore;
         rotation: ParticleAttributeStore;