rapid-render 1.0.21 → 1.0.23
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +7 -28
- package/dist/color.d.ts +1 -1
- package/dist/draw.d.ts +2 -2
- package/dist/extensions/light.d.ts +1 -0
- package/dist/extensions/particle.d.ts +1 -1
- package/dist/index.d.ts +1 -0
- package/dist/matrix-engine.d.ts +25 -31
- package/dist/rapid-render.js +846 -673
- package/dist/rapid-render.umd.cjs +26 -20
- package/dist/region/spriteRegion.d.ts +1 -1
- package/dist/render.d.ts +17 -19
- package/dist/texture.d.ts +11 -2
- package/dist/viewport.d.ts +52 -0
- package/dist/webgl/glshader.d.ts +2 -0
- package/dist/webgl/utils.d.ts +1 -2
- package/package.json +1 -1
- package/dist/texture-filter-mode.d.ts +0 -5
package/README.md
CHANGED
|
@@ -35,18 +35,6 @@ If you want Pixi-level rendering without letting your renderer dictate how your
|
|
|
35
35
|
|
|
36
36
|
Particles, Light & Shadow, Custom Shaders, Lines, Masks, Render textures, Sprites, Custom Geometry, Filters and more. all from one focused WebGL renderer. Yet it is only **22.5 kB gzipped**.
|
|
37
37
|
|
|
38
|
-
## Architecture Recipes
|
|
39
|
-
|
|
40
|
-
Rapid.js handles only the rendering layer, leaving your game architecture entirely in your hands.
|
|
41
|
-
|
|
42
|
-
Rapid.js is frame-stateless, making it easy to build games with different architectures. Below are minimal, working implementations of several popular architectures built on Rapid.js, each in **around 100 lines** of JavaScript.
|
|
43
|
-
|
|
44
|
-
- **Architecture recipes**
|
|
45
|
-
[Game Object](recipes/game-object.js) · [Component](recipes/component.js) · [Display List](recipes/display-list.js) · [ECS Integration](recipes/ecs-integration.js) · [Immediate Mode](recipes/immediate-mode.js)
|
|
46
|
-
|
|
47
|
-
- **Game-engine-style recipes**
|
|
48
|
-
[Kaplay-like](recipes/game-engine/kaplay-like.js) · [Pixi-like](recipes/game-engine/pixi-like.js) · [Phaser-like](recipes/game-engine/phaser-like.js) · [Excalibur-like](recipes/game-engine/excalibur-like.js) · [LittleJS-like](recipes/game-engine/littlejs-like.js) · [p5-like](recipes/game-engine/p5-like.js)
|
|
49
|
-
|
|
50
38
|
## Install
|
|
51
39
|
|
|
52
40
|
```bash
|
|
@@ -113,19 +101,15 @@ stack.restore(); // 1.root
|
|
|
113
101
|
rapid.drawSprite(ui);
|
|
114
102
|
```
|
|
115
103
|
|
|
116
|
-
##
|
|
104
|
+
## Use Saved World Matrices
|
|
117
105
|
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
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.
|
|
106
|
+
`save()` returns the current `parent`, `local`, and `world` matrix IDs. The IDs can be used with `customMatrix` after their stack scope has been restored, as long as they belong to the current frame.
|
|
121
107
|
|
|
122
108
|
```ts
|
|
123
109
|
rapid.clear();
|
|
124
110
|
|
|
125
111
|
const stack = rapid.matrixStack;
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
// Build a transform hierarchy.
|
|
112
|
+
// Build the hierarchy for this frame.
|
|
129
113
|
const world = stack.save();
|
|
130
114
|
stack.translate(200, 200);
|
|
131
115
|
|
|
@@ -135,15 +119,8 @@ stack.translate(80, 0);
|
|
|
135
119
|
stack.restore(); // enemyNode
|
|
136
120
|
stack.restore(); // world
|
|
137
121
|
|
|
138
|
-
//
|
|
139
|
-
//
|
|
140
|
-
matrix.identity(world.local);
|
|
141
|
-
matrix.translate(world.local, 100, 100);
|
|
142
|
-
|
|
143
|
-
// Recalculate only `world` and its descendants.
|
|
144
|
-
stack.updateMatrixSubtree(world);
|
|
145
|
-
|
|
146
|
-
// Render using the stored matrix of the popped child node.
|
|
122
|
+
// The stack has been restored, but enemyNode.world is still available during
|
|
123
|
+
// this frame. Build the hierarchy again next frame with the latest game state.
|
|
147
124
|
rapid.drawSprite({
|
|
148
125
|
texture: enemy,
|
|
149
126
|
customMatrix: enemyNode.world,
|
|
@@ -152,6 +129,8 @@ rapid.drawSprite({
|
|
|
152
129
|
rapid.flush();
|
|
153
130
|
```
|
|
154
131
|
|
|
132
|
+
`MatrixStack` is immediate-mode: rebuild transform hierarchies each frame. For retained scene graphs, keep transforms in your own game objects and feed them into the stack while traversing the scene.
|
|
133
|
+
|
|
155
134
|
With this flexible matrix stack, you can build your own architecture with minimal friction. It doesn't care how you organize your game logic. You can use ECS, scene graphs, components, or any hybrid approach you prefer.
|
|
156
135
|
|
|
157
136
|
For more information about matrix transformations, see the [Transformations](https://nightre.github.io/Rapid.js/docs.html#transformations).
|
package/dist/color.d.ts
CHANGED
|
@@ -14,7 +14,7 @@ export declare class Color {
|
|
|
14
14
|
* @param a - The alpha component (0-255).
|
|
15
15
|
*/
|
|
16
16
|
constructor(r: number, g: number, b: number, a?: number);
|
|
17
|
-
setClearColor(gl: WebGL2RenderingContext): void;
|
|
17
|
+
setClearColor(gl: WebGL2RenderingContext, premultipliedUint32?: boolean): void;
|
|
18
18
|
/**
|
|
19
19
|
* Gets the red component.
|
|
20
20
|
*/
|
package/dist/draw.d.ts
CHANGED
|
@@ -23,8 +23,8 @@ export interface IDrawParticleBatchOptions extends IDisplayOptions {
|
|
|
23
23
|
rotation?: ArrayLike<number> | number;
|
|
24
24
|
color?: ArrayLike<Color> | ArrayLike<number> | number;
|
|
25
25
|
count?: number;
|
|
26
|
-
scaleX?: ArrayLike<number
|
|
27
|
-
scaleY?: ArrayLike<number
|
|
26
|
+
scaleX?: ArrayLike<number> | number;
|
|
27
|
+
scaleY?: ArrayLike<number> | number;
|
|
28
28
|
originX?: number;
|
|
29
29
|
originY?: number;
|
|
30
30
|
flipX?: boolean;
|
|
@@ -8,6 +8,7 @@ import { Region } from '../region/region';
|
|
|
8
8
|
export declare const MAX_LIGHTS = 8;
|
|
9
9
|
export declare class LightShader extends CustomGlShader {
|
|
10
10
|
constructor(rapid: Rapid, vs?: string, fs?: string, usedTextureUnitNum?: number, uniforms?: Record<string, UniformValue>);
|
|
11
|
+
beforePreCompile(): void;
|
|
11
12
|
getGLShader(region: Region, key: string, baseVS: string, baseFS: string): import('..').GLShader | null;
|
|
12
13
|
}
|
|
13
14
|
export type LightMatrix = number | MatrixSaveState;
|
|
@@ -170,7 +170,7 @@ export declare class ParticleEmitter {
|
|
|
170
170
|
* Renders all live particles.
|
|
171
171
|
* In local-space mode the emitter's own transform is applied around the batch.
|
|
172
172
|
*/
|
|
173
|
-
render(): void;
|
|
173
|
+
render(customMatrix?: number): void;
|
|
174
174
|
/** Returns `true` if the emitter is running or still has live particles. */
|
|
175
175
|
isActive(): boolean;
|
|
176
176
|
/**
|
package/dist/index.d.ts
CHANGED
package/dist/matrix-engine.d.ts
CHANGED
|
@@ -20,13 +20,18 @@ export interface ITransformOptions {
|
|
|
20
20
|
* Matrices are stored flat in a dynamic Float32Array to improve memory locality and cache performance.
|
|
21
21
|
*/
|
|
22
22
|
export declare class MatrixStore {
|
|
23
|
-
/**
|
|
23
|
+
/** Number of matrix slots created, including released slots available for reuse. */
|
|
24
24
|
matrixCount: number;
|
|
25
25
|
/** The dynamic buffer used to hold matrix data. */
|
|
26
26
|
buffer: DynamicArrayBuffer;
|
|
27
27
|
/** The raw floating-point data of all matrices. */
|
|
28
28
|
data: Float32Array;
|
|
29
|
+
/** Per-matrix allocation flags: 1 for live matrices, 0 for released matrices. */
|
|
30
|
+
freeFlag: DynamicArrayBuffer;
|
|
31
|
+
/** Stack of released matrix indices available for reuse. */
|
|
32
|
+
freeMatrixStack: DynamicArrayBuffer;
|
|
29
33
|
temporary: number;
|
|
34
|
+
identityMatrix: number;
|
|
30
35
|
/**
|
|
31
36
|
* Creates a new MatrixStore.
|
|
32
37
|
* @param capacity - The initial capacity of the matrix store (default is 10).
|
|
@@ -42,6 +47,8 @@ export declare class MatrixStore {
|
|
|
42
47
|
* @returns The index of the newly allocated matrix.
|
|
43
48
|
*/
|
|
44
49
|
allocDirty(): number;
|
|
50
|
+
/** Releases a matrix index so it can be reused by a later allocation. */
|
|
51
|
+
free(index: number): void;
|
|
45
52
|
/**
|
|
46
53
|
* Resets the store, clearing all allocated matrices.
|
|
47
54
|
*/
|
|
@@ -203,11 +210,13 @@ export declare class MatrixStore {
|
|
|
203
210
|
setMatrix(index: number, f: Float32Array | number[]): void;
|
|
204
211
|
multiplyAffineInPlace(index: number, a: number, b: number, c: number, dValue: number, tx: number, ty: number): void;
|
|
205
212
|
multiplyAffine(indexIn: number, indexOut: number, a: number, b: number, c: number, dValue: number, tx: number, ty: number): void;
|
|
213
|
+
clampBounds(index: number, viewWidth: number, viewHeight: number, limitLeft?: number, limitRight?: number, limitTop?: number, limitBottom?: number): void;
|
|
214
|
+
applyTransform(transform: ITransformOptions, width?: number, height?: number): number[];
|
|
206
215
|
}
|
|
207
216
|
export interface MatrixSaveState {
|
|
208
217
|
world: number;
|
|
209
218
|
local: number;
|
|
210
|
-
|
|
219
|
+
parent: number;
|
|
211
220
|
}
|
|
212
221
|
/**
|
|
213
222
|
* A highly performant MatrixStack useful for hierarchal scene graphs.
|
|
@@ -216,18 +225,9 @@ export interface MatrixSaveState {
|
|
|
216
225
|
export declare class MatrixStack {
|
|
217
226
|
/** The underlying store for matrices. */
|
|
218
227
|
matrix: MatrixStore;
|
|
219
|
-
/** The current step or depth in the transformation hierarchy. */
|
|
220
|
-
step: number;
|
|
221
228
|
/** Internal stack maintaining structural information. */
|
|
222
229
|
stack: DynamicArrayBuffer;
|
|
223
|
-
|
|
224
|
-
stepWorldM: DynamicArrayBuffer;
|
|
225
|
-
/** Records actions (push/pop) taken during the traversal. */
|
|
226
|
-
stepAction: DynamicArrayBuffer;
|
|
227
|
-
/** Records the parent world matrix for each step (used by updateMatrixSubtree). */
|
|
228
|
-
stepParentM: DynamicArrayBuffer;
|
|
229
|
-
stepClose: DynamicArrayBuffer;
|
|
230
|
-
stepStack: DynamicArrayBuffer;
|
|
230
|
+
currStack: DynamicArrayBuffer;
|
|
231
231
|
/** The index of the current local matrix in the matrix store. */
|
|
232
232
|
curLocalM: number;
|
|
233
233
|
/** The index of the current world matrix in the matrix store. */
|
|
@@ -240,7 +240,7 @@ export declare class MatrixStack {
|
|
|
240
240
|
/**
|
|
241
241
|
* Saves the current matrix state and pushes it onto the stack.
|
|
242
242
|
* Equivalent to context.save().
|
|
243
|
-
* @returns
|
|
243
|
+
* @returns Matrix IDs for the saved parent, local, and world transforms.
|
|
244
244
|
*/
|
|
245
245
|
save(): MatrixSaveState;
|
|
246
246
|
/**
|
|
@@ -249,19 +249,17 @@ export declare class MatrixStack {
|
|
|
249
249
|
*/
|
|
250
250
|
restore(): void;
|
|
251
251
|
restoreAll(): void;
|
|
252
|
-
|
|
253
|
-
|
|
254
|
-
|
|
255
|
-
|
|
256
|
-
|
|
257
|
-
|
|
258
|
-
|
|
259
|
-
|
|
260
|
-
|
|
261
|
-
|
|
262
|
-
|
|
263
|
-
step: number;
|
|
264
|
-
}): void;
|
|
252
|
+
/**
|
|
253
|
+
* Removes a matrix from the current and previous frame recycle queues so
|
|
254
|
+
* it remains valid across `reset()` calls.
|
|
255
|
+
*
|
|
256
|
+
* Passing a `MatrixSaveState` retains its `local` and `world` matrices;
|
|
257
|
+
* `parent` is not retained because it belongs to the parent stack state.
|
|
258
|
+
* Retained matrices must eventually be released with `matrix.free()`.
|
|
259
|
+
*
|
|
260
|
+
* @param matrix A matrix ID or the state returned by `save()`.
|
|
261
|
+
*/
|
|
262
|
+
retainMatrix(matrix: number | MatrixSaveState): void;
|
|
265
263
|
/**
|
|
266
264
|
* Translates the current local and world matrices by x and y.
|
|
267
265
|
* @param x - Translation along the x-axis.
|
|
@@ -361,9 +359,5 @@ export declare class MatrixStack {
|
|
|
361
359
|
x: number;
|
|
362
360
|
y: number;
|
|
363
361
|
};
|
|
364
|
-
|
|
365
|
-
* Applies a transform options object to the current matrix state.
|
|
366
|
-
* Optionally saves the matrix first
|
|
367
|
-
*/
|
|
368
|
-
applyTransform(transform: ITransformOptions, width?: number, height?: number, customMatrix?: number): void;
|
|
362
|
+
applyTransform(transform: ITransformOptions, width?: number, height?: number, customMatrix?: number, worldMatrix?: number, localMatrix?: number): void;
|
|
369
363
|
}
|