babylon.quarks 0.17.2 → 0.17.3

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "babylon.quarks",
-  "version": "0.17.2",
+  "version": "0.17.3",
   "description": "A High-Performance Particle System for Babylon.js",
   "type": "module",
   "types": "./dist/types/index.d.ts",
@@ -25,6 +25,7 @@
     "build:js": "cross-env NODE_ENV=production rollup -c",
     "build": "npm run clean && npm run build:types && npm run build:js",
     "test": "jest",
+    "test:coverage": "jest --coverage",
     "prettier": "prettier --write --ignore-unknown **/*.ts"
   },
   "repository": {

package/src/BatchedRenderer.ts

@@ -30,15 +30,44 @@ export interface VFXBatchSettings {
     layerMask: number;
 }
 
+export interface AdaptivePerformanceOptions {
+    targetFrameMs: number;
+    minQuality: number;
+    maxQuality: number;
+    decreaseStep: number;
+    increaseStep: number;
+}
+
+export interface AdaptivePerformanceState extends AdaptivePerformanceOptions {
+    enabled: boolean;
+    currentQuality: number;
+    lastFrameCpuMs: number;
+}
+
 export class BatchedRenderer extends TransformNode {
     batches: Array<VFXBatch> = [];
     systemToBatchIndex: Map<IParticleSystem, number> = new Map<IParticleSystem, number>();
     depthTexture: BaseTexture | null = null;
+    private adaptivePerformanceState: AdaptivePerformanceState = {
+        enabled: false,
+        targetFrameMs: 16.7,
+        minQuality: 0.35,
+        maxQuality: 1,
+        decreaseStep: 0.08,
+        increaseStep: 0.02,
+        currentQuality: 1,
+        lastFrameCpuMs: 0,
+    };
+    private lastAppliedQuality = Number.NaN;
 
     constructor(name: string, scene: Scene) {
         super(name, scene);
     }
 
+    private static clamp(value: number, min: number, max: number): number {
+        return Math.max(min, Math.min(max, value));
+    }
+
     private static equals(a: StoredBatchSettings, b: VFXBatchSettings): boolean {
         return (
             a.materialBlendMode === b.materialBlendMode &&
@@ -62,6 +91,9 @@ export class BatchedRenderer extends TransformNode {
 
     addSystem(system: IParticleSystem) {
         (system as unknown as ParticleSystem)._renderer = this;
+        if (this.adaptivePerformanceState.enabled) {
+            (system as any).setQualityFactor?.(this.adaptivePerformanceState.currentQuality);
+        }
         const settings = (system as unknown as ParticleSystem).getRendererSettings();
         for (let i = 0; i < this.batches.length; i++) {
             if (BatchedRenderer.equals(this.batches[i].settings, settings)) {
@@ -115,13 +147,73 @@ export class BatchedRenderer extends TransformNode {
         }
     }
 
+    configureAdaptivePerformance(options: Partial<AdaptivePerformanceOptions> = {}) {
+        const state = this.adaptivePerformanceState;
+        const minQuality = BatchedRenderer.clamp(options.minQuality ?? state.minQuality, 0.05, 1);
+        const maxQuality = BatchedRenderer.clamp(options.maxQuality ?? state.maxQuality, minQuality, 1);
+        state.targetFrameMs = Math.max(options.targetFrameMs ?? state.targetFrameMs, 0.1);
+        state.minQuality = minQuality;
+        state.maxQuality = maxQuality;
+        state.decreaseStep = Math.max(options.decreaseStep ?? state.decreaseStep, 0.001);
+        state.increaseStep = Math.max(options.increaseStep ?? state.increaseStep, 0.001);
+        state.currentQuality = BatchedRenderer.clamp(state.currentQuality, state.minQuality, state.maxQuality);
+        state.enabled = true;
+        this.lastAppliedQuality = Number.NaN;
+    }
+
+    disableAdaptivePerformance(resetQuality = true) {
+        this.adaptivePerformanceState.enabled = false;
+        if (resetQuality) {
+            this.adaptivePerformanceState.currentQuality = this.adaptivePerformanceState.maxQuality;
+            this.applyAdaptiveQuality();
+        }
+    }
+
+    getAdaptivePerformanceState(): AdaptivePerformanceState {
+        return {...this.adaptivePerformanceState};
+    }
+
+    private applyAdaptiveQuality() {
+        const quality = this.adaptivePerformanceState.currentQuality;
+        if (quality === this.lastAppliedQuality) {
+            return;
+        }
+        for (const ps of this.systemToBatchIndex.keys()) {
+            (ps as any).setQualityFactor?.(quality);
+        }
+        this.lastAppliedQuality = quality;
+    }
+
     update(delta: number) {
-        this.systemToBatchIndex.forEach((_value, ps) => {
+        const adaptiveState = this.adaptivePerformanceState;
+        const frameStart = adaptiveState.enabled ? performance.now() : 0;
+        if (adaptiveState.enabled) {
+            this.applyAdaptiveQuality();
+        }
+        for (const ps of this.systemToBatchIndex.keys()) {
             (ps as any).update(delta);
-        });
+        }
         for (let i = 0; i < this.batches.length; i++) {
             this.batches[i].update();
         }
+        if (!adaptiveState.enabled) {
+            return;
+        }
+
+        adaptiveState.lastFrameCpuMs = performance.now() - frameStart;
+        if (adaptiveState.lastFrameCpuMs > adaptiveState.targetFrameMs) {
+            adaptiveState.currentQuality = BatchedRenderer.clamp(
+                adaptiveState.currentQuality - adaptiveState.decreaseStep,
+                adaptiveState.minQuality,
+                adaptiveState.maxQuality
+            );
+        } else {
+            adaptiveState.currentQuality = BatchedRenderer.clamp(
+                adaptiveState.currentQuality + adaptiveState.increaseStep,
+                adaptiveState.minQuality,
+                adaptiveState.maxQuality
+            );
+        }
     }
 
     dispose(): void {

package/src/ParticleSystem.ts

@@ -206,6 +206,8 @@ export class ParticleSystem implements IParticleSystem {
     private listeners: {[event: string]: Array<(event: ParticleSystemEvent) => void>} = {};
     private readonly layerMaskProxy: {mask: number};
     private materialRef: any = null;
+    private qualityFactor = 1;
+    private useFastTrailHistory = true;
     /** @internal **/
     _renderer?: BatchedRenderer;
 
@@ -456,6 +458,7 @@ export class ParticleSystem implements IParticleSystem {
 
         this.emissionBursts.forEach((burst) => burst.count.startGen(this.memory));
         this.emissionOverDistance.startGen(this.memory);
+        this.refreshTrailHistoryMode();
 
         this.emitEnded = false;
         this.markForDestroy = false;
@@ -474,6 +477,7 @@ export class ParticleSystem implements IParticleSystem {
             layerMask?: number;
         } = {}
     ) {
+        /* istanbul ignore if -- rendererSettings is always assigned in the constructor before any code path can call this private method */
         if (!this.rendererSettings) {
             return;
         }
@@ -534,17 +538,93 @@ export class ParticleSystem implements IParticleSystem {
     play() { this.paused = false; }
     stop() { this.restart(); this.pause(); }
 
+    private refreshTrailHistoryMode() {
+        this.useFastTrailHistory = !this.behaviors.some((behavior) => (behavior as any).type === 'WidthOverLength');
+    }
+
+    private ensureTrailHistoryCapacity(particle: TrailParticle, capacity: number) {
+        const trailAny = particle as any;
+        if (trailAny._trailHistoryCapacity === capacity && trailAny._trailHistoryPositions) {
+            return;
+        }
+        trailAny._trailHistoryCapacity = capacity;
+        trailAny._trailHistoryPositions = new Float32Array(capacity * 3);
+        trailAny._trailHistorySizes = new Float32Array(capacity);
+        trailAny._trailHistoryColors = new Float32Array(capacity * 4);
+        trailAny._trailHistoryHead = 0;
+        trailAny._trailHistoryCount = 0;
+    }
+
+    private resetTrailHistory(particle: TrailParticle) {
+        const trailAny = particle as any;
+        trailAny._trailHistoryHead = 0;
+        trailAny._trailHistoryCount = 0;
+    }
+
+    private getTrailHistoryCount(particle: TrailParticle): number {
+        const trailAny = particle as any;
+        const fastHistoryCount = trailAny._trailHistoryCount;
+        if (typeof fastHistoryCount === 'number') {
+            return fastHistoryCount;
+        }
+        return particle.previous.length;
+    }
+
+    private updateFastTrailHistory(particle: TrailParticle) {
+        const trailAny = particle as any;
+        const capacity = Math.max(1, Math.ceil(particle.length));
+        this.ensureTrailHistoryCapacity(particle, capacity);
+        let head = trailAny._trailHistoryHead as number;
+        let count = trailAny._trailHistoryCount as number;
+        const positions = trailAny._trailHistoryPositions as Float32Array;
+        const sizes = trailAny._trailHistorySizes as Float32Array;
+        const colors = trailAny._trailHistoryColors as Float32Array;
+
+        if (particle.age <= particle.life) {
+            const posIndex = head * 3;
+            positions[posIndex] = particle.position.x;
+            positions[posIndex + 1] = particle.position.y;
+            positions[posIndex + 2] = particle.position.z;
+            sizes[head] = particle.size.x;
+            const colorIndex = head * 4;
+            colors[colorIndex] = particle.color.x;
+            colors[colorIndex + 1] = particle.color.y;
+            colors[colorIndex + 2] = particle.color.z;
+            colors[colorIndex + 3] = particle.color.w;
+            head = (head + 1) % capacity;
+            if (count < capacity) {
+                count++;
+            }
+        } else if (count > 0) {
+            count--;
+        }
+
+        trailAny._trailHistoryHead = head;
+        trailAny._trailHistoryCount = count;
+    }
+
+    setQualityFactor(qualityFactor: number) {
+        this.qualityFactor = Math.max(0.1, Math.min(1, qualityFactor));
+    }
+
     private spawn(count: number, emissionState: EmissionState, matrix: Matrix4) {
         tempQ.setFromRotationMatrix(matrix);
         const translation = tempV;
         const scale = tempV2;
         matrix.decompose(translation, tempQ, scale);
+        const behaviors = this.behaviors;
+        const behaviorCount = behaviors.length;
+        const renderMode = this.rendererSettings.renderMode;
+        const isTrailMode = renderMode === RenderMode.Trail;
+        const timeRatio = emissionState.time / this.duration;
+        const trailSettings = isTrailMode ? (this.rendererEmitterSettings as TrailSettings) : undefined;
+        const followLocalOrigin = Boolean(trailSettings?.followLocalOrigin);
 
         for (let i = 0; i < count; i++) {
             emissionState.burstParticleIndex = i;
             this.particleNum++;
-            while (this.particles.length < this.particleNum) {
-                if (this.rendererSettings.renderMode === RenderMode.Trail) {
+            if (this.particles.length < this.particleNum) {
+                if (isTrailMode) {
                     this.particles.push(new TrailParticle());
                 } else {
                     this.particles.push(new SpriteParticle());
@@ -557,15 +637,15 @@ export class ParticleSystem implements IParticleSystem {
             this.startColor.genColor(particle.memory, particle.startColor, this.emissionState.time);
             particle.color.copy(particle.startColor);
             this.startSpeed.startGen(particle.memory);
-            particle.startSpeed = this.startSpeed.genValue(particle.memory, emissionState.time / this.duration);
+            particle.startSpeed = this.startSpeed.genValue(particle.memory, timeRatio);
             this.startLife.startGen(particle.memory);
-            particle.life = this.startLife.genValue(particle.memory, emissionState.time / this.duration);
+            particle.life = this.startLife.genValue(particle.memory, timeRatio);
             particle.age = 0;
             this.startSize.startGen(particle.memory);
             if (this.startSize.type === 'vec3function') {
-                (this.startSize as Vector3Generator).genValue(particle.memory, particle.startSize, emissionState.time / this.duration);
+                (this.startSize as Vector3Generator).genValue(particle.memory, particle.startSize, timeRatio);
             } else {
-                const size = (this.startSize as FunctionValueGenerator).genValue(particle.memory, emissionState.time / this.duration);
+                const size = (this.startSize as FunctionValueGenerator).genValue(particle.memory, timeRatio);
                 particle.startSize.set(size, size, size);
             }
             this.startTileIndex.startGen(particle.memory);
@@ -581,33 +661,40 @@ export class ParticleSystem implements IParticleSystem {
             ) {
                 const sprite = particle as SpriteParticle;
                 this.startRotation.startGen(particle.memory);
-                if (this.rendererSettings.renderMode === RenderMode.Mesh) {
+                if (renderMode === RenderMode.Mesh) {
                     if (!(sprite.rotation instanceof Quaternion)) {
                         sprite.rotation = new Quaternion();
                     }
                     if (this.startRotation.type === 'rotation') {
-                        this.startRotation.genValue(particle.memory, sprite.rotation as Quaternion, 1, emissionState.time / this.duration);
+                        this.startRotation.genValue(particle.memory, sprite.rotation as Quaternion, 1, timeRatio);
                     } else {
-                        (sprite.rotation as Quaternion).setFromAxisAngle(UP, this.startRotation.genValue(sprite.memory, emissionState.time / this.duration));
+                        (sprite.rotation as Quaternion).setFromAxisAngle(UP, this.startRotation.genValue(sprite.memory, timeRatio));
                     }
                 } else {
                     if (this.startRotation.type === 'rotation') {
                         sprite.rotation = 0;
                     } else {
-                        sprite.rotation = this.startRotation.genValue(sprite.memory, emissionState.time / this.duration);
+                        sprite.rotation = this.startRotation.genValue(sprite.memory, timeRatio);
                     }
                 }
-            } else if (this.rendererSettings.renderMode === RenderMode.Trail) {
+            } else if (isTrailMode && trailSettings) {
                 const trail = particle as TrailParticle;
-                (this.rendererEmitterSettings as TrailSettings).startLength.startGen(trail.memory);
-                trail.length = (this.rendererEmitterSettings as TrailSettings).startLength.genValue(trail.memory, emissionState.time / this.duration);
+                trailSettings.startLength.startGen(trail.memory);
+                trail.length = trailSettings.startLength.genValue(trail.memory, timeRatio);
+                if (this.useFastTrailHistory) {
+                    this.ensureTrailHistoryCapacity(trail, Math.max(1, Math.ceil(trail.length)));
+                    this.resetTrailHistory(trail);
+                }
             }
 
             this.emitterShape.initialize(particle, emissionState);
 
-            if (this.rendererSettings.renderMode === RenderMode.Trail && (this.rendererEmitterSettings as TrailSettings).followLocalOrigin) {
+            if (isTrailMode && followLocalOrigin) {
                 const trail = particle as TrailParticle;
-                trail.localPosition = new Vector3().copy(trail.position);
+                if (!trail.localPosition) {
+                    trail.localPosition = new Vector3();
+                }
+                trail.localPosition.copy(trail.position);
             }
 
             if (this.worldSpace) {
@@ -624,8 +711,8 @@ export class ParticleSystem implements IParticleSystem {
                 }
             }
 
-            for (let j = 0; j < this.behaviors.length; j++) {
-                this.behaviors[j].initialize(particle, this);
+            for (let j = 0; j < behaviorCount; j++) {
+                behaviors[j].initialize(particle, this);
             }
         }
     }
@@ -697,49 +784,66 @@ export class ParticleSystem implements IParticleSystem {
             this.emit(delta, this.emissionState, this.emitter.matrixWorld);
         }
 
+        const particles = this.particles;
+        const behaviorCount = this.behaviors.length;
+        const particleCount = this.particleNum;
         this.emitterShape.update(this, delta);
-        for (let j = 0; j < this.behaviors.length; j++) {
-            this.behaviors[j].frameUpdate(delta);
-            for (let i = 0; i < this.particleNum; i++) {
-                if (!this.particles[i].died) {
-                    this.behaviors[j].update(this.particles[i], delta);
+        for (let j = 0; j < behaviorCount; j++) {
+            const behavior = this.behaviors[j];
+            behavior.frameUpdate(delta);
+            for (let i = 0; i < particleCount; i++) {
+                const particle = particles[i];
+                if (!particle.died) {
+                    behavior.update(particle, delta);
                 }
             }
         }
 
-        for (let i = 0; i < this.particleNum; i++) {
-            if (
-                (this.rendererEmitterSettings as TrailSettings).followLocalOrigin &&
-                (this.particles[i] as TrailParticle).localPosition
-            ) {
-                this.particles[i].position.copy((this.particles[i] as TrailParticle).localPosition!);
-                if (this.particles[i].parentMatrix) {
-                    this.particles[i].position.applyMatrix4(this.particles[i].parentMatrix!);
+        const followLocalOrigin =
+            this.rendererSettings.renderMode === RenderMode.Trail &&
+            (this.rendererEmitterSettings as TrailSettings).followLocalOrigin;
+        const emitterMatrix = this.emitter.matrixWorld;
+        for (let i = 0; i < particleCount; i++) {
+            const particle = particles[i];
+            if (followLocalOrigin && (particle as TrailParticle).localPosition) {
+                particle.position.copy((particle as TrailParticle).localPosition!);
+                if (particle.parentMatrix) {
+                    particle.position.applyMatrix4(particle.parentMatrix);
                 } else {
-                    this.particles[i].position.applyMatrix4(this.emitter.matrixWorld);
+                    particle.position.applyMatrix4(emitterMatrix);
                 }
             } else {
-                this.particles[i].position.addScaledVector(this.particles[i].velocity, delta * this.particles[i].speedModifier);
+                particle.position.addScaledVector(particle.velocity, delta * particle.speedModifier);
             }
-            this.particles[i].age += delta;
+            particle.age += delta;
         }
 
         if (this.rendererSettings.renderMode === RenderMode.Trail) {
-            for (let i = 0; i < this.particleNum; i++) {
-                (this.particles[i] as TrailParticle).update();
+            for (let i = 0; i < particleCount; i++) {
+                const trailParticle = particles[i] as TrailParticle;
+                if (this.useFastTrailHistory) {
+                    this.updateFastTrailHistory(trailParticle);
+                } else {
+                    trailParticle.update();
+                }
             }
         }
 
-        for (let i = 0; i < this.particleNum; i++) {
-            const particle = this.particles[i];
-            if (particle.died && (!(particle instanceof TrailParticle) || particle.previous.length === 0)) {
-                this.particles[i] = this.particles[this.particleNum - 1];
-                this.particles[this.particleNum - 1] = particle;
-                this.particleNum--;
+        let liveParticleCount = this.particleNum;
+        for (let i = 0; i < liveParticleCount; i++) {
+            const particle = particles[i];
+            if (
+                particle.died &&
+                (!(particle instanceof TrailParticle) || this.getTrailHistoryCount(particle as TrailParticle) === 0)
+            ) {
+                particles[i] = particles[liveParticleCount - 1];
+                particles[liveParticleCount - 1] = particle;
+                liveParticleCount--;
                 i--;
                 this.fire({type: 'particleDied', particleSystem: this, particle: particle});
             }
         }
+        this.particleNum = liveParticleCount;
     }
 
     emit(delta: number, emissionState: EmissionState, emitterMatrix: Matrix4) {
@@ -756,17 +860,22 @@ export class ParticleSystem implements IParticleSystem {
         }
 
         this.normalMatrix.getNormalMatrix(emitterMatrix);
+        const emissionBursts = this.emissionBursts;
+        const emissionBurstCount = emissionBursts.length;
+        const qualityFactor = this.qualityFactor;
 
         const totalSpawn = Math.ceil(emissionState.waitEmiting);
         this.spawn(totalSpawn, emissionState, emitterMatrix);
         emissionState.waitEmiting -= totalSpawn;
 
         while (
-            emissionState.burstIndex < this.emissionBursts.length &&
-            this.emissionBursts[emissionState.burstIndex].time <= emissionState.time
+            emissionState.burstIndex < emissionBurstCount &&
+            emissionBursts[emissionState.burstIndex].time <= emissionState.time
         ) {
-            if (Math.random() < this.emissionBursts[emissionState.burstIndex].probability) {
-                const count = this.emissionBursts[emissionState.burstIndex].count.genValue(this.memory, this.time);
+            const burst = emissionBursts[emissionState.burstIndex];
+            if (Math.random() < burst.probability) {
+                const rawCount = burst.count.genValue(this.memory, this.time);
+                const count = qualityFactor >= 0.999 ? rawCount : Math.floor(rawCount * qualityFactor);
                 emissionState.isBursting = true;
                 emissionState.burstParticleCount = count;
                 this.spawn(count, emissionState, emitterMatrix);
@@ -776,12 +885,14 @@ export class ParticleSystem implements IParticleSystem {
         }
 
         if (!this.emitEnded) {
-            emissionState.waitEmiting += delta * this.emissionOverTime.genValue(this.memory, emissionState.time / this.duration);
+            const timeRatio = emissionState.time / this.duration;
+            emissionState.waitEmiting += delta * this.emissionOverTime.genValue(this.memory, timeRatio) * qualityFactor;
 
-            if (emissionState.previousWorldPos != undefined) {
+            const previousWorldPos = emissionState.previousWorldPos;
+            if (previousWorldPos !== undefined) {
                 this.temp.set(emitterMatrix.elements[12], emitterMatrix.elements[13], emitterMatrix.elements[14]);
-                emissionState.travelDistance += emissionState.previousWorldPos.distanceTo(this.temp);
-                const emitPerMeter = this.emissionOverDistance.genValue(this.memory, emissionState.time / this.duration);
+                emissionState.travelDistance += previousWorldPos.distanceTo(this.temp);
+                const emitPerMeter = this.emissionOverDistance.genValue(this.memory, timeRatio) * qualityFactor;
                 if (emissionState.travelDistance * emitPerMeter > 0) {
                     const count = Math.floor(emissionState.travelDistance * emitPerMeter);
                     emissionState.travelDistance -= count / emitPerMeter;
@@ -1071,6 +1182,7 @@ export class ParticleSystem implements IParticleSystem {
 
     addBehavior(behavior: Behavior) {
         this.behaviors.push(behavior);
+        this.refreshTrailHistoryMode();
     }
 
     getRendererSettings(): VFXBatchSettings {

package/src/SpriteBatch.ts

@@ -111,6 +111,7 @@ export class SpriteBatch extends VFXBatch {
 
     rebuildMaterial(): void {
         const shaderName = `quarksParticle_${this.settings.renderMode}_${Date.now()}`;
+        this.lastStretchedSpeedFactor = Number.NaN;
         let vertexShader: string;
         let fragmentShader: string;
         const defines: string[] = [];
@@ -247,10 +248,14 @@ export class SpriteBatch extends VFXBatch {
     private quaternion3_ = new Quaternion();
     private rotationMat_ = new Matrix3();
     private rotationMat2_ = new Matrix3();
+    private lastStretchedSpeedFactor = Number.NaN;
 
     update(): void {
         let index = 0;
         let particleCount = 0;
+        const renderMode = this.settings.renderMode;
+        const isMeshRender = renderMode === RenderMode.Mesh;
+        const isStretchedRender = renderMode === RenderMode.StretchedBillBoard;
 
         const visibleSystems = this.getVisibleSystems();
         for (const system of visibleSystems) {
@@ -266,15 +271,19 @@ export class SpriteBatch extends VFXBatch {
             const rotation = this.quaternion2_;
             const translation = this.vector2_;
             const scale = this.vector3_;
+            const systemWorldSpace = system.worldSpace;
             system.emitter.matrixWorld.decompose(translation, rotation, scale);
             this.rotationMat_.setFromMatrix4(system.emitter.matrixWorld);
+            const absScaleX = Math.abs(scale.x);
+            const absScaleY = Math.abs(scale.y);
+            const absScaleZ = Math.abs(scale.z);
 
             for (let j = 0; j < particleNum; j++, index++) {
                 const particle = particles[j] as SpriteParticle;
 
-                if (this.settings.renderMode === RenderMode.Mesh) {
+                if (isMeshRender) {
                     let q: Quaternion;
-                    if (system.worldSpace) {
+                    if (systemWorldSpace) {
                         q = particle.rotation as Quaternion;
                     } else {
                         let parentQ: Quaternion;
@@ -296,7 +305,7 @@ export class SpriteBatch extends VFXBatch {
                 }
 
                 let vec: Vector3;
-                if (system.worldSpace) {
+                if (systemWorldSpace) {
                     vec = particle.position;
                 } else {
                     vec = this.vector_;
@@ -319,7 +328,7 @@ export class SpriteBatch extends VFXBatch {
                 this.colorBuffer[ci + 3] = particle.color.w;
 
                 const si = index * 3;
-                if (system.worldSpace) {
+                if (systemWorldSpace) {
                     this.sizeBuffer[si] = particle.size.x;
                     this.sizeBuffer[si + 1] = particle.size.y;
                     this.sizeBuffer[si + 2] = particle.size.z;
@@ -329,20 +338,20 @@ export class SpriteBatch extends VFXBatch {
                         this.sizeBuffer[si + 1] = particle.size.y;
                         this.sizeBuffer[si + 2] = particle.size.z;
                     } else {
-                        this.sizeBuffer[si] = particle.size.x * Math.abs(scale.x);
-                        this.sizeBuffer[si + 1] = particle.size.y * Math.abs(scale.y);
-                        this.sizeBuffer[si + 2] = particle.size.z * Math.abs(scale.z);
+                        this.sizeBuffer[si] = particle.size.x * absScaleX;
+                        this.sizeBuffer[si + 1] = particle.size.y * absScaleY;
+                        this.sizeBuffer[si + 2] = particle.size.z * absScaleZ;
                     }
                 }
 
                 this.uvTileBuffer[index] = particle.uvTile;
 
-                if (this.settings.renderMode === RenderMode.StretchedBillBoard && this.velocityBuffer) {
+                if (isStretchedRender && this.velocityBuffer) {
                     let speedFactor = (system.rendererEmitterSettings as StretchedBillBoardSettings).speedFactor;
                     if (speedFactor === 0) speedFactor = 0.001;
                     const lengthFactor = (system.rendererEmitterSettings as StretchedBillBoardSettings).lengthFactor;
                     let vel: Vector3;
-                    if (system.worldSpace) {
+                    if (systemWorldSpace) {
                         vel = particle.velocity;
                     } else {
                         vel = this.vector_;
@@ -362,9 +371,13 @@ export class SpriteBatch extends VFXBatch {
             }
         }
 
-        if (this.settings.renderMode === RenderMode.StretchedBillBoard && this.mesh.material instanceof ShaderMaterial && visibleSystems.length > 0) {
+        if (isStretchedRender && this.mesh.material instanceof ShaderMaterial && visibleSystems.length > 0) {
             const speedFactor = (visibleSystems[0].rendererEmitterSettings as StretchedBillBoardSettings).speedFactor ?? 1.0;
-            this.mesh.material.setFloat('speedFactor', speedFactor === 0 ? 0.001 : speedFactor);
+            const clampedSpeedFactor = speedFactor === 0 ? 0.001 : speedFactor;
+            if (clampedSpeedFactor !== this.lastStretchedSpeedFactor) {
+                this.mesh.material.setFloat('speedFactor', clampedSpeedFactor);
+                this.lastStretchedSpeedFactor = clampedSpeedFactor;
+            }
         }
 
         this.mesh.forcedInstanceCount = index;
@@ -376,7 +389,7 @@ export class SpriteBatch extends VFXBatch {
             this.colorVB.update(this.colorBuffer);
             this.uvTileVB.update(this.uvTileBuffer);
             this.rotationVB.update(this.rotationBuffer);
-            if (this.settings.renderMode === RenderMode.StretchedBillBoard && this.velocityVB && this.velocityBuffer) {
+            if (isStretchedRender && this.velocityVB && this.velocityBuffer) {
                 this.velocityVB.update(this.velocityBuffer);
             }
         }

package/src/TrailBatch.ts

@@ -27,6 +27,15 @@ export class TrailBatch extends VFXBatch {
     private sideVB!: VertexBuffer;
     private widthVB!: VertexBuffer;
 
+    private getTrailHistoryCount(particle: TrailParticle): number {
+        const trailAny = particle as any;
+        const fastHistoryCount = trailAny._trailHistoryCount;
+        if (typeof fastHistoryCount === 'number') {
+            return fastHistoryCount;
+        }
+        return particle.previous.length;
+    }
+
     constructor(settings: VFXBatchSettings, scene: Scene) {
         super(settings, scene);
         this.maxParticles = 10000;
@@ -61,7 +70,7 @@ export class TrailBatch extends VFXBatch {
         this.mesh.setVerticesData(VertexBuffer.PositionKind, this.positionBuffer, true);
         this.mesh.setVerticesData(VertexBuffer.UVKind, this.uvBuffer, true);
         this.mesh.setVerticesData(VertexBuffer.ColorKind, this.colorBuffer, true, 4);
-        this.mesh.setIndices(Array.from(this.indexBuffer.subarray(0, 6)), null, true);
+        this.mesh.setIndices(this.indexBuffer.subarray(0, 6), null, true);
         const engine = this.scene.getEngine();
         this.previousVB = new VertexBuffer(engine, this.previousBuffer, 'previous', true, false, 3, false);
         this.nextVB = new VertexBuffer(engine, this.nextBuffer, 'next', true, false, 3, false);
@@ -162,7 +171,7 @@ export class TrailBatch extends VFXBatch {
         const visibleSystems = this.getVisibleSystems();
         for (const system of visibleSystems) {
             for (let j = 0; j < system.particleNum; j++) {
-                particleCount += (system.particles[j] as TrailParticle).previous.length * 2;
+                particleCount += this.getTrailHistoryCount(system.particles[j] as TrailParticle) * 2;
             }
         }
         if (particleCount > this.maxParticles) {
@@ -185,109 +194,177 @@ export class TrailBatch extends VFXBatch {
             const vTileCount = this.settings.vTileCount;
             const tileWidth = 1 / uTileCount;
             const tileHeight = 1 / vTileCount;
+            const systemWorldSpace = system.worldSpace;
+            const objectScale = (Math.abs(scale.x) + Math.abs(scale.y) + Math.abs(scale.z)) / 3;
 
             for (let j = 0; j < particleNum; j++) {
                 const particle = particles[j] as TrailParticle;
+                const particleAny = particle as any;
+                const fastHistoryCount = particleAny._trailHistoryCount as number | undefined;
+                const fastHistoryCapacity = particleAny._trailHistoryCapacity as number | undefined;
+                const fastHistoryHead = particleAny._trailHistoryHead as number | undefined;
+                const fastHistoryPositions = particleAny._trailHistoryPositions as Float32Array | undefined;
+                const fastHistorySizes = particleAny._trailHistorySizes as Float32Array | undefined;
+                const fastHistoryColors = particleAny._trailHistoryColors as Float32Array | undefined;
+                const hasFastHistory =
+                    typeof fastHistoryCount === 'number' &&
+                    fastHistoryCount > 0 &&
+                    typeof fastHistoryCapacity === 'number' &&
+                    typeof fastHistoryHead === 'number' &&
+                    fastHistoryPositions instanceof Float32Array &&
+                    fastHistorySizes instanceof Float32Array &&
+                    fastHistoryColors instanceof Float32Array;
+                const historyCapacity = hasFastHistory ? (fastHistoryCapacity as number) : 0;
+                const historyHead = hasFastHistory ? (fastHistoryHead as number) : 0;
+                const historyPositions = fastHistoryPositions as Float32Array;
+                const historySizes = fastHistorySizes as Float32Array;
+                const historyColors = fastHistoryColors as Float32Array;
+                const particleHistory = particle.previous;
+                const particleHistoryLength = hasFastHistory ? fastHistoryCount : particleHistory.length;
+                if (particleHistoryLength === 0) {
+                    continue;
+                }
                 const col = particle.uvTile % vTileCount;
                 const row = Math.floor(particle.uvTile / vTileCount + 0.001);
-
-                const iter = particle.previous.values();
-                let curIter = iter.next();
-                let previous: RecordState = curIter.value as RecordState;
-                let current: RecordState = previous;
-                if (!curIter.done) curIter = iter.next();
-                let next: RecordState;
-                if (curIter.value !== undefined) {
-                    next = curIter.value as RecordState;
-                } else {
-                    next = current;
-                }
-
-                for (let i = 0; i < particle.previous.length; i++, index += 2) {
-                    let pos: Vector3;
-                    if (system.worldSpace) {
-                        pos = current.position;
+                const particleMatrix = particle.parentMatrix as unknown as Matrix4 | undefined;
+                const matrixToUse = particleMatrix ?? system.emitter.matrixWorld;
+
+                let previousNode = particleHistory.head;
+                let currentNode = previousNode;
+                let nextNode = currentNode?.next ?? currentNode;
+                const oldestFastHistoryIndex = hasFastHistory
+                    ? (historyHead - particleHistoryLength + historyCapacity) % historyCapacity
+                    : 0;
+
+                for (let i = 0; i < particleHistoryLength; i++, index += 2) {
+                    let currentX: number;
+                    let currentY: number;
+                    let currentZ: number;
+                    let currentSize: number;
+                    let currentColorX: number;
+                    let currentColorY: number;
+                    let currentColorZ: number;
+                    let currentColorW: number;
+                    let previousX: number;
+                    let previousY: number;
+                    let previousZ: number;
+                    let nextX: number;
+                    let nextY: number;
+                    let nextZ: number;
+
+                    if (hasFastHistory) {
+                        const currentHistoryIndex = (oldestFastHistoryIndex + i) % historyCapacity;
+                        const previousHistoryIndex = i === 0 ? currentHistoryIndex : (oldestFastHistoryIndex + i - 1) % historyCapacity;
+                        const nextHistoryIndex =
+                            i + 1 < particleHistoryLength
+                                ? (oldestFastHistoryIndex + i + 1) % historyCapacity
+                                : currentHistoryIndex;
+
+                        const currentPosIndex = currentHistoryIndex * 3;
+                        const previousPosIndex = previousHistoryIndex * 3;
+                        const nextPosIndex = nextHistoryIndex * 3;
+
+                        currentX = historyPositions[currentPosIndex];
+                        currentY = historyPositions[currentPosIndex + 1];
+                        currentZ = historyPositions[currentPosIndex + 2];
+                        previousX = historyPositions[previousPosIndex];
+                        previousY = historyPositions[previousPosIndex + 1];
+                        previousZ = historyPositions[previousPosIndex + 2];
+                        nextX = historyPositions[nextPosIndex];
+                        nextY = historyPositions[nextPosIndex + 1];
+                        nextZ = historyPositions[nextPosIndex + 2];
+
+                        currentSize = historySizes[currentHistoryIndex];
+                        const currentColorIndex = currentHistoryIndex * 4;
+                        currentColorX = historyColors[currentColorIndex];
+                        currentColorY = historyColors[currentColorIndex + 1];
+                        currentColorZ = historyColors[currentColorIndex + 2];
+                        currentColorW = historyColors[currentColorIndex + 3];
                     } else {
-                        if (particle.parentMatrix) {
-                            this.vector_.copy(current.position).applyMatrix4(particle.parentMatrix as unknown as Matrix4);
-                        } else {
-                            this.vector_.copy(current.position).applyMatrix4(system.emitter.matrixWorld);
-                        }
-                        pos = this.vector_;
+                        const previous = previousNode!.data as RecordState;
+                        const current = currentNode!.data as RecordState;
+                        const next = nextNode!.data as RecordState;
+                        currentX = current.position.x;
+                        currentY = current.position.y;
+                        currentZ = current.position.z;
+                        previousX = previous.position.x;
+                        previousY = previous.position.y;
+                        previousZ = previous.position.z;
+                        nextX = next.position.x;
+                        nextY = next.position.y;
+                        nextZ = next.position.z;
+                        currentSize = current.size;
+                        currentColorX = current.color.x;
+                        currentColorY = current.color.y;
+                        currentColorZ = current.color.z;
+                        currentColorW = current.color.w;
                     }
-                    const pi = index * 3;
-                    this.positionBuffer[pi] = pos.x;
-                    this.positionBuffer[pi + 1] = pos.y;
-                    this.positionBuffer[pi + 2] = pos.z;
-                    this.positionBuffer[pi + 3] = pos.x;
-                    this.positionBuffer[pi + 4] = pos.y;
-                    this.positionBuffer[pi + 5] = pos.z;
-
-                    let prevPos: Vector3;
-                    if (system.worldSpace) {
-                        prevPos = previous.position;
-                    } else {
-                        if (particle.parentMatrix) {
-                            this.vector_.copy(previous.position).applyMatrix4(particle.parentMatrix as unknown as Matrix4);
-                        } else {
-                            this.vector_.copy(previous.position).applyMatrix4(system.emitter.matrixWorld);
-                        }
-                        prevPos = this.vector_;
-                    }
-                    this.previousBuffer[pi] = prevPos.x;
-                    this.previousBuffer[pi + 1] = prevPos.y;
-                    this.previousBuffer[pi + 2] = prevPos.z;
-                    this.previousBuffer[pi + 3] = prevPos.x;
-                    this.previousBuffer[pi + 4] = prevPos.y;
-                    this.previousBuffer[pi + 5] = prevPos.z;
-
-                    let nextPos: Vector3;
-                    if (system.worldSpace) {
-                        nextPos = next.position;
-                    } else {
-                        if (particle.parentMatrix) {
-                            this.vector_.copy(next.position).applyMatrix4(particle.parentMatrix as unknown as Matrix4);
-                        } else {
-                            this.vector_.copy(next.position).applyMatrix4(system.emitter.matrixWorld);
-                        }
-                        nextPos = this.vector_;
+
+                    if (!systemWorldSpace) {
+                        this.vector_.set(currentX, currentY, currentZ).applyMatrix4(matrixToUse);
+                        currentX = this.vector_.x;
+                        currentY = this.vector_.y;
+                        currentZ = this.vector_.z;
+                        this.vector_.set(previousX, previousY, previousZ).applyMatrix4(matrixToUse);
+                        previousX = this.vector_.x;
+                        previousY = this.vector_.y;
+                        previousZ = this.vector_.z;
+                        this.vector_.set(nextX, nextY, nextZ).applyMatrix4(matrixToUse);
+                        nextX = this.vector_.x;
+                        nextY = this.vector_.y;
+                        nextZ = this.vector_.z;
                     }
-                    this.nextBuffer[pi] = nextPos.x;
-                    this.nextBuffer[pi + 1] = nextPos.y;
-                    this.nextBuffer[pi + 2] = nextPos.z;
-                    this.nextBuffer[pi + 3] = nextPos.x;
-                    this.nextBuffer[pi + 4] = nextPos.y;
-                    this.nextBuffer[pi + 5] = nextPos.z;
+
+                    const pi = index * 3;
+                    this.positionBuffer[pi] = currentX;
+                    this.positionBuffer[pi + 1] = currentY;
+                    this.positionBuffer[pi + 2] = currentZ;
+                    this.positionBuffer[pi + 3] = currentX;
+                    this.positionBuffer[pi + 4] = currentY;
+                    this.positionBuffer[pi + 5] = currentZ;
+
+                    this.previousBuffer[pi] = previousX;
+                    this.previousBuffer[pi + 1] = previousY;
+                    this.previousBuffer[pi + 2] = previousZ;
+                    this.previousBuffer[pi + 3] = previousX;
+                    this.previousBuffer[pi + 4] = previousY;
+                    this.previousBuffer[pi + 5] = previousZ;
+
+                    this.nextBuffer[pi] = nextX;
+                    this.nextBuffer[pi + 1] = nextY;
+                    this.nextBuffer[pi + 2] = nextZ;
+                    this.nextBuffer[pi + 3] = nextX;
+                    this.nextBuffer[pi + 4] = nextY;
+                    this.nextBuffer[pi + 5] = nextZ;
 
                     this.sideBuffer[index] = 1;
                     this.sideBuffer[index + 1] = -1;
 
-                    if (system.worldSpace || particle.parentMatrix) {
-                        this.widthBuffer[index] = current.size;
-                        this.widthBuffer[index + 1] = current.size;
+                    if (systemWorldSpace || particle.parentMatrix) {
+                        this.widthBuffer[index] = currentSize;
+                        this.widthBuffer[index + 1] = currentSize;
                     } else {
-                        const objectScale = (Math.abs(scale.x) + Math.abs(scale.y) + Math.abs(scale.z)) / 3;
-                        this.widthBuffer[index] = current.size * objectScale;
-                        this.widthBuffer[index + 1] = current.size * objectScale;
+                        this.widthBuffer[index] = currentSize * objectScale;
+                        this.widthBuffer[index + 1] = currentSize * objectScale;
                     }
 
                     const ui = index * 2;
-                    this.uvBuffer[ui] = (i / particle.previous.length + col) * tileWidth;
+                    this.uvBuffer[ui] = (i / particleHistoryLength + col) * tileWidth;
                     this.uvBuffer[ui + 1] = (vTileCount - row - 1) * tileHeight;
-                    this.uvBuffer[ui + 2] = (i / particle.previous.length + col) * tileWidth;
+                    this.uvBuffer[ui + 2] = (i / particleHistoryLength + col) * tileWidth;
                     this.uvBuffer[ui + 3] = (vTileCount - row) * tileHeight;
 
                     const cci = index * 4;
-                    this.colorBuffer[cci] = current.color.x;
-                    this.colorBuffer[cci + 1] = current.color.y;
-                    this.colorBuffer[cci + 2] = current.color.z;
-                    this.colorBuffer[cci + 3] = current.color.w;
-                    this.colorBuffer[cci + 4] = current.color.x;
-                    this.colorBuffer[cci + 5] = current.color.y;
-                    this.colorBuffer[cci + 6] = current.color.z;
-                    this.colorBuffer[cci + 7] = current.color.w;
-
-                    if (i + 1 < particle.previous.length) {
+                    this.colorBuffer[cci] = currentColorX;
+                    this.colorBuffer[cci + 1] = currentColorY;
+                    this.colorBuffer[cci + 2] = currentColorZ;
+                    this.colorBuffer[cci + 3] = currentColorW;
+                    this.colorBuffer[cci + 4] = currentColorX;
+                    this.colorBuffer[cci + 5] = currentColorY;
+                    this.colorBuffer[cci + 6] = currentColorZ;
+                    this.colorBuffer[cci + 7] = currentColorW;
+
+                    if (i + 1 < particleHistoryLength) {
                         this.indexBuffer[triangles * 3] = index;
                         this.indexBuffer[triangles * 3 + 1] = index + 1;
                         this.indexBuffer[triangles * 3 + 2] = index + 2;
@@ -298,13 +375,10 @@ export class TrailBatch extends VFXBatch {
                         triangles++;
                     }
 
-                    previous = current;
-                    current = next;
-                    if (!curIter.done) {
-                        curIter = iter.next();
-                        if (curIter.value !== undefined) {
-                            next = curIter.value as RecordState;
-                        }
+                    if (!hasFastHistory) {
+                        previousNode = currentNode;
+                        currentNode = nextNode;
+                        nextNode = nextNode?.next ?? nextNode;
                     }
                 }
             }
@@ -313,7 +387,7 @@ export class TrailBatch extends VFXBatch {
         if (index > 0 && triangles > 0) {
             this.mesh.updateVerticesData(VertexBuffer.PositionKind, this.positionBuffer);
             this.mesh.updateVerticesData(VertexBuffer.UVKind, this.uvBuffer);
-            this.mesh.updateIndices(Array.from(this.indexBuffer.subarray(0, triangles * 3)));
+            this.mesh.updateIndices(this.indexBuffer.subarray(0, triangles * 3));
             this.previousVB.update(this.previousBuffer);
             this.nextVB.update(this.nextBuffer);
             this.sideVB.update(this.sideBuffer);

package/src/VFXBatch.ts

@@ -81,7 +81,13 @@ export abstract class VFXBatch {
     }
 
     getVisibleSystems(): IParticleSystem[] {
-        return Array.from(this.systems).filter((system) => system.emitter.visible);
+        const visibleSystems: IParticleSystem[] = [];
+        for (const system of this.systems) {
+            if (system.emitter.visible) {
+                visibleSystems.push(system);
+            }
+        }
+        return visibleSystems;
     }
 
     applyDepthTexture(depthTexture: BaseTexture | null): void {

package/src/index.ts

@@ -49,6 +49,4 @@ export type {
 
 registerShaderChunks();
 loadPlugin(MeshSurfaceEmitterPlugin);
-// remove this line if you have pro license
-console.log('%c Particle system powered by babylon.quarks. https://quarks.art/', 'font-size: 14px; font-weight: bold;');