@zephyr3d/scene 0.9.6 → 0.9.7

package/dist/camera/camera.js

@@ -3,6 +3,7 @@ import { SceneNode } from '../scene/scene_node.js';
 import { Compositor } from '../posteffect/compositor.js';
 import { TAA } from '../posteffect/taa.js';
 import { SSR } from '../posteffect/ssr.js';
+import { SSS } from '../posteffect/sss.js';
 import { Tonemap } from '../posteffect/tonemap.js';
 import { FXAA } from '../posteffect/fxaa.js';
 import { Bloom } from '../posteffect/bloom.js';
@@ -14,26 +15,57 @@ import { ScreenAdapter } from '../app/screen.js';
 import { ABufferOIT } from '../render/abuffer_oit.js';
 import { WeightedBlendedOIT } from '../render/weightedblended_oit.js';
 
-/**
- * A renderable camera node that manages view/projection math, frusta,
- * input control, picking, and a post-processing chain via a compositor.
- *
- * Key features:
- * - Maintains projection, view, VP, and inverse VP matrices and lazily recomputes them when invalidated.
- * - Provides world- and view-space frusta for culling and clipping.
- * - Supports perspective and orthographic projections.
- * - Integrates with post effects (Tonemap, FXAA, TAA, Bloom, SSR, SSAO, Motion Blur) through an internal `Compositor`.
- * - Handles temporal jitter and history state when TAA or motion blur are enabled.
- * - Emits picking rays from screen coordinates and supports async GPU picking.
- * - Optional controller integration for user input handling.
- *
- * Performance notes:
- * - Matrices/frusta are computed on demand and cached until invalidation.
- * - Temporal jitter and history are set up only when required by enabled features and device support.
- *
- * @public
+const SSS_DEFAULT_SETTINGS = {
+    blurScale: 11,
+    strength: 0.65,
+    transmissionStrength: 0.18,
+    transmissionPower: 2.1,
+    multiScatter: 0.08
+};
+const SSS_QUALITY_PRESET_SETTINGS = {
+    quality: {
+        halfRes: false,
+        blurKernelSize: 11,
+        blurStdDev: 3.5,
+        blurDepthCutoff: 0.24,
+        normalCutoff: 0.82
+    },
+    balanced: {
+        halfRes: false,
+        blurKernelSize: 9,
+        blurStdDev: 3,
+        blurDepthCutoff: 0.26,
+        normalCutoff: 0.78
+    },
+    performance: {
+        halfRes: true,
+        blurKernelSize: 7,
+        blurStdDev: 2.4,
+        blurDepthCutoff: 0.32,
+        normalCutoff: 0.72
+    }
+};
+/**
+ * A renderable camera node that manages view/projection math, frusta,
+ * input control, picking, and a post-processing chain via a compositor.
+ *
+ * Key features:
+ * - Maintains projection, view, VP, and inverse VP matrices and lazily recomputes them when invalidated.
+ * - Provides world- and view-space frusta for culling and clipping.
+ * - Supports perspective and orthographic projections.
+ * - Integrates with post effects (Tonemap, FXAA, TAA, Bloom, SSR, SSS, SSAO, Motion Blur) through an internal `Compositor`.
+ * - Handles temporal jitter and history state when TAA or motion blur are enabled.
+ * - Emits picking rays from screen coordinates and supports async GPU picking.
+ * - Optional controller integration for user input handling.
+ *
+ * Performance notes:
+ * - Matrices/frusta are computed on demand and cached until invalidation.
+ * - Temporal jitter and history are set up only when required by enabled features and device support.
+ *
+ * @public
  */ class Camera extends SceneNode {
     /** @internal Halton 2-3 sequence used for TAA jittering. */ static _halton23 = halton23(16);
+    /** @internal Per-camera history resources. */ static _historyData = new WeakMap();
     /** @internal Per-camera history resource manager. */ static _historyResourceManager = new WeakMap();
     /** @internal Screen adapter for this camera */ _screenAdapter;
     /** @internal Whether the camera is adapted */ _adapted;
@@ -60,6 +92,7 @@ import { WeightedBlendedOIT } from '../render/weightedblended_oit.js';
     /** @internal OIT algorithm selection mode. */ _oitMode;
     /** @internal ABuffer OIT layer budget. */ _oitABufferLayers;
     /** @internal Whether to perform a depth pre-pass. */ _depthPrePass;
+    /** @internal Render path selection for scene renderer. */ _renderPath;
     /** @internal Whether command buffers may be reused for optimization. */ _commandBufferReuse;
     /** @internal Hi-Z acceleration enable (primarily for SSR). */ _HiZ;
     /** @internal If true, a float point backbuffer will be used. The default value is true */ _HDR;
@@ -87,6 +120,7 @@ import { WeightedBlendedOIT } from '../render/weightedblended_oit.js';
     /** @internal TAA enable flag (via post effect). */ _TAA;
     /** @internal TAA post effect reference. */ _postEffectTAA;
     /** @internal TAA debug mode (implementation-defined). */ _TAADebug;
+    /** @internal Cascaded shadow debug visualization flag. */ _shadowDebugCascades;
     /** @internal SSR enable flag (via post effect). */ _SSR;
     /** @internal SSR post effect reference. */ _postEffectSSR;
     /** @internal SSR parameter vector: (maxDistance, iterations, thickness, reserved). */ _ssrParams;
@@ -98,6 +132,18 @@ import { WeightedBlendedOIT } from '../render/weightedblended_oit.js';
     /** @internal SSR blur depth cutoff. */ _ssrBlurDepthCutoff;
     /** @internal SSR blur kernel size. */ _ssrBlurKernelSize;
     /** @internal SSR Gaussian blur standard deviation. */ _ssrBlurStdDev;
+    /** @internal Whether SSR temporal accumulation is enabled. */ _ssrTemporal;
+    /** @internal SSR temporal blending weight in [0, 1]. */ _ssrTemporalWeight;
+    /** @internal SSS enable flag (via post effect). */ _SSS;
+    /** @internal SSS post effect reference. */ _postEffectSSS;
+    /** @internal SSS blur scale in pixels per authored width unit. */ _sssBlurScale;
+    /** @internal High-level preset that resolves SSS blur quality controls. */ _sssQualityPreset;
+    /** @internal SSS composite strength. */ _sssStrength;
+    /** @internal SSS thin-shell transmission strength. */ _sssTransmissionStrength;
+    /** @internal SSS thin-shell transmission exponent. */ _sssTransmissionPower;
+    /** @internal SSS multi-scatter energy compensation. */ _sssMultiScatter;
+    /** @internal Cached runtime SSS settings after applying the quality preset. */ _sssResolvedSettings;
+    /** @internal SSS debug visualization mode. */ _sssDebugView;
     /** @internal SSAO enable flag (via post effect). */ _SSAO;
     /** @internal SSAO post effect reference. */ _postEffectSSAO;
     /** @internal SSAO scale (sampling radius multiplier). */ _SSAOScale;
@@ -120,14 +166,14 @@ import { WeightedBlendedOIT } from '../render/weightedblended_oit.js';
     /** @internal Post-processing compositor attached to this camera. */ _compositor;
     /** @internal Pointer interaction rectangle in css pixels (relative to canvas) */ _interactionRect;
     /** @internal captured by which mouse button (-1 if not captured) */ _capturedButton;
-    /**
-   * Creates a new camera node.
-   *
-   * Initializes projection/view matrices, temporal fields, controller linkage, and
-   * builds the default post-processing pipeline on the internal compositor.
-   *
-   * @param scene - The scene that owns this camera.
-   * @param projectionMatrix - Optional projection matrix to initialize with.
+    /**
+   * Creates a new camera node.
+   *
+   * Initializes projection/view matrices, temporal fields, controller linkage, and
+   * builds the default post-processing pipeline on the internal compositor.
+   *
+   * @param scene - The scene that owns this camera.
+   * @param projectionMatrix - Optional projection matrix to initialize with.
    */ constructor(scene, projectionMatrix){
         super(scene);
         this._projMatrix = projectionMatrix || Matrix4x4.identity();
@@ -153,6 +199,7 @@ import { WeightedBlendedOIT } from '../render/weightedblended_oit.js';
         this._oitMode = 'none';
         this._oitABufferLayers = 20;
         this._depthPrePass = false;
+        this._renderPath = 'forward';
         this._screenAdapter = new ScreenAdapter();
         this._adapted = false;
         this._HiZ = false;
@@ -181,17 +228,38 @@ import { WeightedBlendedOIT } from '../render/weightedblended_oit.js';
         this._TAA = false;
         this._postEffectTAA = new DRef();
         this._TAADebug = 0;
+        this._shadowDebugCascades = false;
         this._SSR = false;
         this._postEffectSSR = new DRef();
-        this._ssrParams = new Vector4(100, 120, 0.5, 0);
-        this._ssrMaxRoughness = 0.8;
+        this._ssrParams = new Vector4(64, 96, 0.9, 0);
+        this._ssrMaxRoughness = 0.55;
         this._ssrRoughnessFactor = 1;
-        this._ssrStride = 2;
+        this._ssrStride = 1;
         this._ssrCalcThickness = false;
-        this._ssrBlurriness = 0.01;
+        this._ssrBlurriness = 0.008;
         this._ssrBlurDepthCutoff = 2;
-        this._ssrBlurKernelSize = 10;
-        this._ssrBlurStdDev = 10;
+        this._ssrBlurKernelSize = 5;
+        this._ssrBlurStdDev = 4;
+        this._ssrTemporal = true;
+        this._ssrTemporalWeight = 0.85;
+        this._SSS = false;
+        this._postEffectSSS = new DRef();
+        this._sssBlurScale = SSS_DEFAULT_SETTINGS.blurScale;
+        this._sssQualityPreset = 'balanced';
+        this._sssStrength = SSS_DEFAULT_SETTINGS.strength;
+        this._sssTransmissionStrength = SSS_DEFAULT_SETTINGS.transmissionStrength;
+        this._sssTransmissionPower = SSS_DEFAULT_SETTINGS.transmissionPower;
+        this._sssMultiScatter = SSS_DEFAULT_SETTINGS.multiScatter;
+        const defaultSSSQualityPreset = SSS_QUALITY_PRESET_SETTINGS.balanced;
+        this._sssResolvedSettings = {
+            halfRes: defaultSSSQualityPreset.halfRes,
+            blurKernelSize: defaultSSSQualityPreset.blurKernelSize,
+            blurStdDev: defaultSSSQualityPreset.blurStdDev,
+            blurDepthCutoff: defaultSSSQualityPreset.blurDepthCutoff,
+            normalCutoff: defaultSSSQualityPreset.normalCutoff
+        };
+        this.updateSSSResolvedSettings();
+        this._sssDebugView = 'none';
         this._SSAO = false;
         this._postEffectSSAO = new DRef();
         this._SSAOScale = 10;
@@ -220,73 +288,81 @@ import { WeightedBlendedOIT } from '../render/weightedblended_oit.js';
             scene.mainCamera = this;
         }
     }
-    /**
-   * The compositor that owns and runs the camera's post-processing chain.
+    /**
+   * The compositor that owns and runs the camera's post-processing chain.
    */ get compositor() {
         return this._compositor;
     }
-    /**
-   * Pointer interaction rectangle in css pixels (relative to canvas)
+    /**
+   * Pointer interaction rectangle in css pixels (relative to canvas)
    */ get interactionRect() {
         return this._interactionRect;
     }
     set interactionRect(rect) {
         this._interactionRect = rect;
     }
-    /**
-   * Framebuffer clear color, or `null` to disable.
+    /**
+   * Framebuffer clear color, or `null` to disable.
    */ get clearColor() {
         return this._clearColor;
     }
     set clearColor(v) {
         this._clearColor = v?.clone() ?? null;
     }
-    /**
-   * Framebuffer stencil clear value, disabled when null. Default is 0.
+    /**
+   * Framebuffer stencil clear value, disabled when null. Default is 0.
    */ get clearDepth() {
         return this._clearDepth;
     }
     set clearDepth(v) {
         this._clearDepth = v;
     }
-    /**
-   * Framebuffer stencil clear value, disabled when null. Default is 0.
+    /**
+   * Framebuffer stencil clear value, disabled when null. Default is 0.
    */ get clearStencil() {
         return this._clearStencil;
     }
     set clearStencil(v) {
         this._clearStencil = v;
     }
-    /**
-   * Whether Hi-Z acceleration is enabled.
-   *
-   * Often improves SSR performance with little quality impact when supported.
+    /**
+   * Whether Hi-Z acceleration is enabled.
+   *
+   * Often improves SSR performance with little quality impact when supported.
    */ get HiZ() {
         return this._HiZ;
     }
     set HiZ(val) {
         this._HiZ = !!val;
     }
-    /**
-   * Whether HDR backbuffer is enabled.
-   *
-   * Tonemap should be disabled when not using HDR backbuffer.
+    /**
+   * Render path used by the scene renderer.
+   */ get renderPath() {
+        return this._renderPath;
+    }
+    set renderPath(_val) {
+        this._renderPath = 'forward';
+    }
+    /**
+   * Whether HDR backbuffer is enabled.
+   *
+   * Tonemap should be disabled when not using HDR backbuffer.
    */ get HDR() {
         return this._HDR;
     }
     set HDR(val) {
         this._HDR = !!val;
     }
-    /**
-   * Whether tonemapping is enabled via the post effect.
+    /**
+   * Whether tonemapping is enabled via the post effect.
    */ get toneMap() {
         return this._postEffectTonemap.get().enabled;
     }
     set toneMap(val) {
         this._postEffectTonemap.get().enabled = !!val;
     }
-    /**
-   * Whether motion blur is enabled via the post effect.
+    /**
+   * Whether motion blur is enabled via the post effect.
    */ get motionBlur() {
         return this._postEffectMotionBlur.get().enabled;
     }
@@ -302,16 +378,16 @@ import { WeightedBlendedOIT } from '../render/weightedblended_oit.js';
             this._postEffectMotionBlur.get().strength = this._motionBlurStrength;
         }
     }
-    /**
-   * Gets whether Bloom is enabled.
+    /**
+   * Gets whether Bloom is enabled.
    */ get bloom() {
         return this._postEffectBloom.get().enabled;
     }
     set bloom(val) {
         this._postEffectBloom.get().enabled = !!val;
     }
-    /**
-   * Maximum bloom downsample levels
+    /**
+   * Maximum bloom downsample levels
    */ get bloomMaxDownsampleLevels() {
         return this._bloomMaxDownsampleLevels;
     }
@@ -321,8 +397,8 @@ import { WeightedBlendedOIT } from '../render/weightedblended_oit.js';
             this._postEffectBloom.get().maxDownsampleLevel = val;
         }
     }
-    /**
-   * Bloom downsample limit
+    /**
+   * Bloom downsample limit
    */ get bloomDownsampleLimit() {
         return this._bloomDownsampleLimit;
     }
@@ -332,8 +408,8 @@ import { WeightedBlendedOIT } from '../render/weightedblended_oit.js';
             this._postEffectBloom.get().downsampleLimit = val;
         }
     }
-    /**
-   * Bloom threshold
+    /**
+   * Bloom threshold
    */ get bloomThreshold() {
         return this._bloomThreshold;
     }
@@ -343,8 +419,8 @@ import { WeightedBlendedOIT } from '../render/weightedblended_oit.js';
             this._postEffectBloom.get().threshold = val;
         }
     }
-    /**
-   * Bloom threshold knee
+    /**
+   * Bloom threshold knee
    */ get bloomThresholdKnee() {
         return this._bloomThresholdKnee;
     }
@@ -354,8 +430,8 @@ import { WeightedBlendedOIT } from '../render/weightedblended_oit.js';
             this._postEffectBloom.get().thresholdKnee = val;
         }
     }
-    /**
-   * Bloom intensity
+    /**
+   * Bloom intensity
    */ get bloomIntensity() {
         return this._bloomIntensity;
     }
@@ -407,16 +483,16 @@ import { WeightedBlendedOIT } from '../render/weightedblended_oit.js';
             this._postEffectColorAdjust.get().sharpen = val;
         }
     }
-    /**
-   * Gets whether FXAA is enabled.
+    /**
+   * Gets whether FXAA is enabled.
    */ get FXAA() {
         return this._postEffectFXAA.get().enabled;
     }
     set FXAA(val) {
         this._postEffectFXAA.get().enabled = !!val;
     }
-    /**
-   * Tonemap exposure
+    /**
+   * Tonemap exposure
    */ get toneMapExposure() {
         return this._tonemapExposure;
     }
@@ -426,134 +502,221 @@ import { WeightedBlendedOIT } from '../render/weightedblended_oit.js';
             this._postEffectTonemap.get().exposure = val;
         }
     }
-    /**
-   * Gets whether TAA is enabled.
+    /**
+   * Gets whether TAA is enabled.
    */ get TAA() {
         return this._postEffectTAA.get().enabled;
     }
     set TAA(val) {
         this._postEffectTAA.get().enabled = !!val;
     }
-    /**
-   * Gets the debug flag for TAA
+    /**
+   * Gets the debug flag for TAA
    */ get TAADebug() {
         return this._TAADebug;
     }
     set TAADebug(val) {
         this._TAADebug = val;
     }
-    /**
-   * Gets whether Screen Space Reflections (SSR) is enabled.
+    /**
+   * Enables cascade debug visualization for directional shadows.
+   */ get shadowDebugCascades() {
+        return this._shadowDebugCascades;
+    }
+    set shadowDebugCascades(val) {
+        this._shadowDebugCascades = !!val;
+    }
+    /**
+   * Gets whether Screen Space Reflections (SSR) is enabled.
    */ get SSR() {
         return this._postEffectSSR.get().enabled;
     }
     set SSR(val) {
         this._postEffectSSR.get().enabled = !!val;
     }
-    /**
-   * Gets the maximum roughness value for screen space reflections.
-   * Controls the cutoff point where surfaces are considered too rough for SSR.
+    /**
+   * Gets the maximum roughness value for screen space reflections.
+   * Controls the cutoff point where surfaces are considered too rough for SSR.
    */ get ssrMaxRoughness() {
         return this._ssrMaxRoughness;
     }
     set ssrMaxRoughness(val) {
         this._ssrMaxRoughness = val;
     }
-    /**
-   * Gets the roughness factor for SSR calculations.
-   * Affects how surface roughness influences reflection clarity.
+    /**
+   * Gets the roughness factor for SSR calculations.
+   * Affects how surface roughness influences reflection clarity.
    */ get ssrRoughnessFactor() {
         return this._ssrRoughnessFactor;
     }
     set ssrRoughnessFactor(val) {
         this._ssrRoughnessFactor = val;
     }
-    /**
-   * Gets the stride value for SSR ray marching.
-   * Controls the step size during ray marching. Larger values improve performance but may miss details.
+    /**
+   * Gets the stride value for SSR ray marching.
+   * Controls the step size during ray marching. Larger values improve performance but may miss details.
    */ get ssrStride() {
         return this._ssrStride;
     }
     set ssrStride(val) {
         this._ssrStride = val;
     }
-    /**
-   * Gets the maximum distance for SSR ray marching.
-   * Defines how far rays will travel when searching for reflection intersections.
+    /**
+   * Gets the maximum distance for SSR ray marching.
+   * Defines how far rays will travel when searching for reflection intersections.
    */ get ssrMaxDistance() {
         return this._ssrParams.x;
     }
     set ssrMaxDistance(val) {
         this._ssrParams.x = val;
     }
-    /**
-   * Gets the number of iterations for SSR ray marching.
-   * Higher values provide more accurate reflections but impact performance.
+    /**
+   * Gets the number of iterations for SSR ray marching.
+   * Higher values provide more accurate reflections but impact performance.
    */ get ssrIterations() {
         return this._ssrParams.y;
     }
     set ssrIterations(val) {
         this._ssrParams.y = val;
     }
-    /**
-   * Gets the thickness value for SSR calculations.
-   * Determines the thickness threshold for surfaces when calculating reflections.
+    /**
+   * Gets the thickness value for SSR calculations.
+   * Determines the thickness threshold for surfaces when calculating reflections.
    */ get ssrThickness() {
         return this._ssrParams.z;
     }
     set ssrThickness(val) {
         this._ssrParams.z = val;
     }
-    /**
-   * Gets whether SSR should calculate thickness automatically.
-   * When enabled, the system will dynamically compute surface thickness for reflections.
+    /**
+   * Gets whether SSR should calculate thickness automatically.
+   * When enabled, the system will dynamically compute surface thickness for reflections.
    */ get ssrCalcThickness() {
         return this._ssrCalcThickness;
     }
     set ssrCalcThickness(val) {
         this._ssrCalcThickness = !!val;
     }
-    /**
-   * Gets the blur scale factor for SSR.
-   * Controls the overall intensity of the blur effect applied to reflections.
+    /**
+   * Gets the blur scale factor for SSR.
+   * Controls the overall intensity of the blur effect applied to reflections.
    */ get ssrBlurScale() {
         return this._ssrBlurriness;
     }
     set ssrBlurScale(val) {
         this._ssrBlurriness = val;
     }
-    /**
-   * Gets the depth cutoff value for SSR blur.
-   * Determines at what depth difference the blur effect should be reduced or eliminated.
+    /**
+   * Gets the depth cutoff value for SSR blur.
+   * Determines at what depth difference the blur effect should be reduced or eliminated.
    */ get ssrBlurDepthCutoff() {
         return this._ssrBlurDepthCutoff;
     }
     set ssrBlurDepthCutoff(val) {
         this._ssrBlurDepthCutoff = val;
     }
-    /**
-   * Gets the kernel size for the SSR blur effect.
-   * Defines the size of the blur kernel. Larger values create softer, more spread-out blur.
+    /**
+   * Gets the kernel size for the SSR blur effect.
+   * Defines the size of the blur kernel. Larger values create softer, more spread-out blur.
    */ get ssrBlurKernelSize() {
         return this._ssrBlurKernelSize;
     }
     set ssrBlurKernelSize(val) {
         this._ssrBlurKernelSize = val;
     }
-    /**
-   * Gets the standard deviation for the SSR Gaussian blur.
-   * Controls the distribution of the blur effect. Higher values create more pronounced blur.
+    /**
+   * Gets the standard deviation for the SSR Gaussian blur.
+   * Controls the distribution of the blur effect. Higher values create more pronounced blur.
    */ get ssrBlurStdDev() {
         return this._ssrBlurStdDev;
     }
     set ssrBlurStdDev(val) {
         this._ssrBlurStdDev = val;
     }
+    /**
+   * Gets whether SSR temporal accumulation is enabled.
+   */ get ssrTemporal() {
+        return this._ssrTemporal;
+    }
+    set ssrTemporal(val) {
+        this._ssrTemporal = !!val;
+    }
+    /**
+   * Gets SSR temporal blending weight in [0, 1].
+   * Higher values rely more on reprojected history.
+   */ get ssrTemporalWeight() {
+        return this._ssrTemporalWeight;
+    }
+    set ssrTemporalWeight(val) {
+        this._ssrTemporalWeight = Math.max(0, Math.min(1, val ?? 0));
+    }
+    /**
+   * Gets whether Screen Space Subsurface Scattering (SSS) is enabled.
+   */ get SSS() {
+        return this._postEffectSSS.get().enabled;
+    }
+    set SSS(val) {
+        this._postEffectSSS.get().enabled = !!val;
+    }
+    /** Global blur scale for screen-space SSS. */ get sssBlurScale() {
+        return this._sssBlurScale;
+    }
+    set sssBlurScale(val) {
+        this._sssBlurScale = Math.max(0, val ?? 0);
+    }
+    /**
+   * High-level quality preset for SSS blur controls.
+   *
+   * This is the primary user-facing SSS quality control and only affects
+   * the blur sampling quality/performance tradeoff, not the authored look.
+   */ get sssQualityPreset() {
+        return this._sssQualityPreset;
+    }
+    set sssQualityPreset(val) {
+        const next = Camera.resolveSSSQualityPreset(val);
+        if (next !== this._sssQualityPreset) {
+            this._sssQualityPreset = next;
+            this.updateSSSResolvedSettings();
+        }
+    }
+    /** Final SSS composite strength. */ get sssStrength() {
+        return this._sssStrength;
+    }
+    set sssStrength(val) {
+        this._sssStrength = Math.max(0, val ?? 0);
+    }
+    /** Thin-shell transmission strength. */ get sssTransmissionStrength() {
+        return this._sssTransmissionStrength;
+    }
+    set sssTransmissionStrength(val) {
+        this._sssTransmissionStrength = Math.max(0, val ?? 0);
+    }
+    /** Thin-shell transmission exponent. */ get sssTransmissionPower() {
+        return this._sssTransmissionPower;
+    }
+    set sssTransmissionPower(val) {
+        this._sssTransmissionPower = Math.max(0.1, val ?? 0.1);
+    }
+    /** Multi-scatter energy compensation factor. */ get sssMultiScatter() {
+        return this._sssMultiScatter;
+    }
+    set sssMultiScatter(val) {
+        this._sssMultiScatter = Math.max(0, val ?? 0);
+    }
+    /** Resolved SSS blur settings after applying the quality preset. */ get sssResolvedSettings() {
+        return this._sssResolvedSettings;
+    }
+    /** Debug visualization for screen-space SSS buffers. */ get sssDebugView() {
+        return this._sssDebugView;
+    }
+    set sssDebugView(val) {
+        this._sssDebugView = val ?? 'none';
+    }
     /** @internal */ get ssrParams() {
         return this._ssrParams;
     }
-    /**
-   * Gets whether SSAO is enabled.
+    /**
+   * Gets whether SSAO is enabled.
    */ get SSAO() {
         return this._postEffectSSAO.get().enabled;
     }
@@ -617,7 +780,7 @@ import { WeightedBlendedOIT } from '../render/weightedblended_oit.js';
     set commandBufferReuse(val) {
         this._commandBufferReuse = !!val;
     }
-    /** Whether this camera is adapted to screen settings */ get adapted() {
+    /** Whether this camera is adapted to screen settins */ get adapted() {
         return this._adapted;
     }
     set adapted(val) {
@@ -693,27 +856,27 @@ import { WeightedBlendedOIT } from '../render/weightedblended_oit.js';
         }
         return this._viewport;
     }
-    /**
-   * Screen configuration used for adapting the camera viewport
+    /**
+   * Screen configuration used for adapting the camera viewport
    */ get screenConfig() {
         return this._screenAdapter.config;
     }
     set screenConfig(config) {
         this._screenAdapter.config = config;
     }
-    /**
-   * Screen viewport used for adapting the camera viewport
+    /**
+   * Screen viewport used for adapting the camera viewport
    */ get screenViewport() {
         return this._screenAdapter.viewport;
     }
     set screenViewport(viewport) {
         this._screenAdapter.viewport = viewport;
     }
-    /**
-   * Handle input events
-   * @param ev - input event object
-   * @param type - event type, default to ev.type
-   * @returns Boolean value indicates whether the event was handled.
+    /**
+   * Handle input events
+   * @param ev - input event object
+   * @param type - event type, default to ev.type
+   * @returns Boolean value indicates whether the event was handled.
    */ handleEvent(ev, type) {
         let handled = false;
         if (this._controller) {
@@ -746,17 +909,15 @@ import { WeightedBlendedOIT } from '../render/weightedblended_oit.js';
         }
         return handled;
     }
-    /**
-   * Constructs a ray based on the given screen coordinates.
-   *
-   * @param x - The x-component of the screen coordinates, relative to the top-left corner of the viewport.
-   * @param y - The y-component of the screen coordinates, relative to the top-left corner of the viewport.
-   * @param viewportWidth - Optional width of the viewport for normalizing screen coordinates. If not provided, it will be derived from the camera's viewport or the device's viewport.
-   * @param viewportHeight - Optional height of the viewport for normalizing screen coordinates. If not provided, it will be derived from the camera's viewport or the device's viewport.
-   * @returns The ray originating from the camera position and passing through the given screen coordinates.
-   */ constructRay(x, y, viewportWidth, viewportHeight) {
-        const width = viewportWidth ?? (this.viewport ? this.viewport[2] : getDevice().getViewport().width);
-        const height = viewportHeight ?? (this.viewport ? this.viewport[3] : getDevice().getViewport().height);
+    /**
+   * Constructs a ray based on the given screen coordinates.
+   *
+   * @param x - The x-component of the screen coordinates, relative to the top-left corner of the viewport.
+   * @param y - The y-component of the screen coordinates, relative to the top-left corner of the viewport.
+   * @returns The ray originating from the camera position and passing through the given screen coordinates.
+   */ constructRay(x, y) {
+        const width = this.viewport ? this.viewport[2] : getDevice().getViewport().width;
+        const height = this.viewport ? this.viewport[3] : getDevice().getViewport().height;
         const ndcX = 2 * x / width - 1;
         const ndcY = 1 - 2 * y / height;
         const nearClip = new Vector4(ndcX, ndcY, -1, 1);
@@ -771,54 +932,54 @@ import { WeightedBlendedOIT } from '../render/weightedblended_oit.js';
         const vDir = Vector3.sub(farWorld.xyz(), vEye).inplaceNormalize();
         return new Ray(vEye, vDir);
     }
-    /**
-   * Place the camera by specifying the camera position and the target point
-   * @param eye - The camera position
-   * @param target - The target point to look at
-   * @param up - The up vector
-   * @returns self
+    /**
+   * Place the camera by specifying the camera position and the target point
+   * @param eye - The camera position
+   * @param target - The target point to look at
+   * @param up - The up vector
+   * @returns self
    */ lookAt(eye, target, up) {
         return this.setLocalTransform(Matrix4x4.lookAt(eye, target, up));
     }
-    /**
-   * Place the camera to look at a given cube face at a given camera position
-   * @param face - The cube face to look at
-   * @param position - The camera position
-   * @returns self
+    /**
+   * Place the camera to look at a given cube face at a given camera position
+   * @param face - The cube face to look at
+   * @param position - The camera position
+   * @returns self
    */ lookAtCubeFace(face, position) {
         return this.setLocalTransform(Matrix4x4.lookAtCubeFace(face, position ?? this.position));
     }
-    /**
-   * Setup a perspective projection matrix for the camera
-   * @param fovY - The vertical field of view in radians.
-   * @param aspect - The aspect ratio
-   * @param zNear - The near clip plane
-   * @param zFar - The far clip plane
-   * @returns self
+    /**
+   * Setup a perspective projection matrix for the camera
+   * @param fovY - The vertical field of view in radians.
+   * @param aspect - The aspect ratio
+   * @param zNear - The near clip plane
+   * @param zFar - The far clip plane
+   * @returns self
    */ setPerspective(fovY, aspect, zNear, zFar) {
         this._projMatrix.perspective(fovY, aspect, zNear, zFar);
         Matrix4x4.invert(this._projMatrix, this._invProjMatrix);
         this._invalidate(true);
         return this;
     }
-    /**
-   * Setup a orthogonal projection matrix for the camera
-   * @param left - Left bound of the frustum
-   * @param right - Right bound of the frustum
-   * @param bottom - Bottom bound of the frustum
-   * @param top - Top bound of the frustum
-   * @param near - Near bound of the frustum.
-   * @param far - Far bound of the frustum.
-   * @returns self
+    /**
+   * Setup a orthogonal projection matrix for the camera
+   * @param left - Left bound of the frustum
+   * @param right - Right bound of the frustum
+   * @param bottom - Bottom bound of the frustum
+   * @param top - Top bound of the frustum
+   * @param near - Near bound of the frustum.
+   * @param far - Far bound of the frustum.
+   * @returns self
    */ setOrtho(left, right, bottom, top, near, far) {
         this._projMatrix.ortho(left, right, bottom, top, near, far);
         Matrix4x4.invert(this._projMatrix, this._invProjMatrix);
         this._invalidate(true);
         return this;
     }
-    /**
-   * Setup a projection matrix for the camera
-   * @param matrix - The projection matrix
+    /**
+   * Setup a projection matrix for the camera
+   * @param matrix - The projection matrix
    */ setProjectionMatrix(matrix) {
         if (matrix && matrix !== this._projMatrix) {
             this._projMatrix = matrix;
@@ -826,18 +987,18 @@ import { WeightedBlendedOIT } from '../render/weightedblended_oit.js';
             this._invalidate(true);
         }
     }
-    /**
-   * Gets the projection matrix of the camera
-   * @returns The projection matrix
+    /**
+   * Gets the projection matrix of the camera
+   * @returns The projection matrix
    */ getProjectionMatrix() {
         if (this.dirtyCheck()) {
             this._compute();
         }
         return this._projMatrix;
     }
-    /**
-   * Gets the inverse projection matrix of the camera
-   * @returns The projection matrix
+    /**
+   * Gets the inverse projection matrix of the camera
+   * @returns The projection matrix
    */ getInvProjectionMatrix() {
         if (this.dirtyCheck()) {
             this._compute();
@@ -855,11 +1016,11 @@ import { WeightedBlendedOIT } from '../render/weightedblended_oit.js';
         rotationMatrix.setRow(2, new Vector4(zAxis.x, zAxis.y, zAxis.z, 0));
         return rotationMatrix;
     }
-    /**
-   * View matrix of the camera
-   *
-   * @remarks
-   * Camera's view matrix will transform a point from the world space to the camera space
+    /**
+   * View matrix of the camera
+   *
+   * @remarks
+   * Camera's view matrix will transform a point from the world space to the camera space
    */ get viewMatrix() {
         if (this.dirtyCheck()) {
             this._compute();
@@ -872,11 +1033,11 @@ import { WeightedBlendedOIT } from '../render/weightedblended_oit.js';
         }
         return this._viewProjMatrix;
     }
-    /**
-   * The inverse-view-projection matrix of the camera
-   *
-   * @remarks
-   * The inverse-view-projection matrix transforms a point from the clip space to the camera space
+    /**
+   * The inverse-view-projection matrix of the camera
+   *
+   * @remarks
+   * The inverse-view-projection matrix transforms a point from the clip space to the camera space
    */ get invViewProjectionMatrix() {
         if (this.dirtyCheck()) {
             this._compute();
@@ -928,32 +1089,40 @@ import { WeightedBlendedOIT } from '../render/weightedblended_oit.js';
     /** Returns true if the camera is orthographic */ isOrtho() {
         return this.getProjectionMatrix().isOrtho();
     }
-    /**
-   * Gets the camera history resource manager for temporal effects
-   * @returns History resource manager
-   */ getHistoryResourceManager() {
-        let manager = Camera._historyResourceManager.get(this);
-        if (!manager) {
-            // Import dynamically to avoid circular dependency
-            // The actual import happens in forward_plus_builder.ts
-            return null;
+    /**
+   * Gets the camera history data which is used in temporal reprojection
+   * @returns Camera history data
+   */ getHistoryData() {
+        let data = Camera._historyData.get(this);
+        if (!data) {
+            data = {
+                prevColorTex: null,
+                prevMotionVectorTex: null,
+                prevSSRReflectTex: null,
+                prevSSRMotionVectorTex: null
+            };
+            Camera._historyData.set(this, data);
         }
-        return manager;
-    }
-    /**
-   * Sets the camera history resource manager for temporal effects
-   * @internal
-   */ setHistoryResourceManager(manager) {
-        Camera._historyResourceManager.set(this, manager);
+        return data;
     }
-    /**
-   * Clears the camera history data which is used in temporal reprojection
+    /**
+   * Clears the camera history data which is used in temporal reprojection
    */ clearHistoryData() {
-        // Clear history resource manager
-        const manager = Camera._historyResourceManager.get(this);
-        if (manager) {
-            manager.dispose();
-            Camera._historyResourceManager.delete(this);
+        const data = Camera._historyData.get(this);
+        if (data) {
+            if (data.prevColorTex) {
+                getDevice().pool.releaseTexture(data.prevColorTex);
+            }
+            if (data.prevMotionVectorTex) {
+                getDevice().pool.releaseTexture(data.prevMotionVectorTex);
+            }
+            if (data.prevSSRReflectTex) {
+                getDevice().pool.releaseTexture(data.prevSSRReflectTex);
+            }
+            if (data.prevSSRMotionVectorTex) {
+                getDevice().pool.releaseTexture(data.prevSSRMotionVectorTex);
+            }
+            Camera._historyData.delete(this);
         }
         this._prevVPMatrix = null;
         this._prevPosition = null;
@@ -968,6 +1137,12 @@ import { WeightedBlendedOIT } from '../render/weightedblended_oit.js';
             this._postEffectSSR.set(ssr);
             this._compositor.appendPostEffect(ssr);
         }
+        if (!this._postEffectSSS.get()) {
+            const sss = new SSS();
+            sss.enabled = false;
+            this._postEffectSSS.set(sss);
+            this._compositor.appendPostEffect(sss);
+        }
         if (!this._postEffectSSAO.get()) {
             const ssao = new SAO();
             ssao.enabled = false;
@@ -1027,14 +1202,32 @@ import { WeightedBlendedOIT } from '../render/weightedblended_oit.js';
             this._compositor.appendPostEffect(bloom);
         }
     }
-    /**
-   * Renders a scene
-   * @param scene - The scene to be rendered
-   * @param compositor - Compositor instance that will be used to apply postprocess effects
+    static resolveSSSQualityPreset(val) {
+        switch(val){
+            case 'quality':
+            case 'balanced':
+            case 'performance':
+                return val;
+            default:
+                return 'balanced';
+        }
+    }
+    updateSSSResolvedSettings() {
+        const source = SSS_QUALITY_PRESET_SETTINGS[this._sssQualityPreset];
+        this._sssResolvedSettings.halfRes = source.halfRes;
+        this._sssResolvedSettings.blurKernelSize = source.blurKernelSize;
+        this._sssResolvedSettings.blurStdDev = source.blurStdDev;
+        this._sssResolvedSettings.blurDepthCutoff = source.blurDepthCutoff;
+        this._sssResolvedSettings.normalCutoff = source.normalCutoff;
+    }
+    /**
+   * Renders a scene
+   * @param scene - The scene to be rendered
+   * @param compositor - Compositor instance that will be used to apply postprocess effects
    */ render(scene) {
         const device = getDevice();
         //this.updatePostProcessing(device);
-        const useMotionVector = (this.TAA || this.motionBlur) && device.type !== 'webgl';
+        const useMotionVector = (this.TAA || this.motionBlur || this.SSR && this.ssrTemporal) && device.type !== 'webgl';
         const useTAA = useMotionVector && this.TAA;
         scene.dispatchEvent('startrender', scene, this, this._compositor);
         if (useMotionVector) {
@@ -1104,13 +1297,13 @@ import { WeightedBlendedOIT } from '../render/weightedblended_oit.js';
     /** @internal */ getPickPosY() {
         return this._pickPosY;
     }
-    /**
-   * Updates the controller state
+    /**
+   * Updates the controller state
    */ updateController() {
         this._controller?.update();
     }
-    /**
-   * Reset the controller
+    /**
+   * Reset the controller
    */ resetController() {
         this._controller?.reset();
     }
@@ -1135,6 +1328,18 @@ import { WeightedBlendedOIT } from '../render/weightedblended_oit.js';
     /** @internal */ get prevPosition() {
         return this._prevPosition;
     }
+    /**
+   * Gets the camera history resource manager for temporal effects.
+   */ getHistoryResourceManager() {
+        return Camera._historyResourceManager.get(this) ?? null;
+    }
+    /**
+   * Sets the camera history resource manager for temporal effects.
+   *
+   * @internal
+   */ setHistoryResourceManager(manager) {
+        Camera._historyResourceManager.set(this, manager);
+    }
     /** @internal */ setController(controller) {
         if (this._controller !== controller) {
             if (controller && controller._getCamera() && controller._getCamera() !== this) {
@@ -1176,6 +1381,7 @@ import { WeightedBlendedOIT } from '../render/weightedblended_oit.js';
         this._postEffectFXAA.dispose();
         this._postEffectMotionBlur.dispose();
         this._postEffectSSAO.dispose();
+        this._postEffectSSS.dispose();
         this._postEffectSSR.dispose();
         this._postEffectTAA.dispose();
         this._postEffectTonemap.dispose();