rayzee 5.0.2 → 5.1.1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "rayzee",
-  "version": "5.0.2",
+  "version": "5.1.1",
   "type": "module",
   "description": "Real-time WebGPU path tracing engine built on Three.js",
   "main": "dist/rayzee.umd.js",
@@ -34,7 +34,7 @@
     "prepublishOnly": "npm run build"
   },
   "peerDependencies": {
-    "three": ">=0.170.0"
+    "three": ">=0.183.2"
   },
   "dependencies": {
     "stats-gl": "^4.0.2"

package/src/PathTracerApp.js

@@ -533,6 +533,11 @@ export class PathTracerApp extends EventDispatcher {
 
 		if ( ! this._sdf.uploadToPathTracer( this.stages.pathTracer, this.lightManager, this.meshScene, environmentTexture ) ) return false;
 
+		// Build per-mesh visibility buffer (must happen before setupMaterial so the
+		// shader graph captures the storage node during compilation)
+		this.stages.pathTracer._meshRefs = this.stages.pathTracer._collectMeshRefs( this.meshScene );
+		this.stages.pathTracer.setMeshVisibilityData( this.stages.pathTracer._meshRefs );
+
 		timer.end( 'GPU data transfer' );
 
 		// Compile shaders
@@ -877,7 +882,7 @@ export class PathTracerApp extends EventDispatcher {
 
 		this.stages.pathTracer?.materialData.updateMaterialProperty( materialIndex, property, value );
 
-		const emissiveAffectingProps = [ 'emissive', 'emissiveIntensity', 'visible' ];
+		const emissiveAffectingProps = [ 'emissive', 'emissiveIntensity' ];
 		if ( emissiveAffectingProps.includes( property )
 			&& this.stages.pathTracer?.enableEmissiveTriangleSampling?.value ) {
 
@@ -896,6 +901,30 @@ export class PathTracerApp extends EventDispatcher {
 
 	}
 
+	/**
+	 * Update per-mesh visibility without rebuilding the scene.
+	 * Walks the parent chain to resolve world-space visibility.
+	 * @param {number} meshIndex
+	 * @param {boolean} visible
+	 */
+	setMeshVisibility( meshIndex, visible ) {
+
+		this.stages.pathTracer?.updateMeshVisibility( meshIndex, visible );
+		this.reset();
+
+	}
+
+	/**
+	 * Recompute world-visibility for all meshes.
+	 * Call after changing visibility on groups or parent objects.
+	 */
+	updateAllMeshVisibility() {
+
+		this.stages.pathTracer?.updateAllMeshVisibility();
+		this.reset();
+
+	}
+
 	/**
 	 * Updates a material's texture transform (offset, repeat, rotation).
 	 * @param {number} materialIndex

package/src/Pipeline/RenderStage.js

@@ -142,7 +142,6 @@ export class RenderStage {
 
 		const renderMode = context.getState( 'renderMode' ) || 0;
 		const tileRenderingComplete = context.getState( 'tileRenderingComplete' );
-		const frame = context.getState( 'frame' ) || 0;
 
 		switch ( this.executionMode ) {
 

package/src/Processor/AssetLoader.js

@@ -1,4 +1,4 @@
-import { Box3, Vector3, RectAreaLight, Color, FloatType, LinearFilter, EquirectangularReflectionMapping, LinearMipmapLinearFilter,
+import { Box3, Vector3, RectAreaLight, Color, FloatType, LinearFilter, EquirectangularReflectionMapping,
 	TextureLoader, Mesh, MeshStandardMaterial, MeshPhysicalMaterial, CircleGeometry, Points, PointsMaterial, LoadingManager, EventDispatcher
 } from 'three';
 import { GLTFLoader } from 'three/addons/loaders/GLTFLoader.js';
@@ -171,8 +171,6 @@ export class AssetLoader extends EventDispatcher {
 			}
 
 			texture.generateMipmaps = true;
-			// texture.minFilter = LinearMipmapLinearFilter;
-			// texture.magFilter = LinearFilter;
 
 			this.applyEnvironmentToScene( texture );
 			this.dispatchEvent( { type: 'load', texture } );
@@ -353,7 +351,7 @@ export class AssetLoader extends EventDispatcher {
 
 	}
 
-	async findAndLoadModelFromZip( zip, filename ) {
+	async findAndLoadModelFromZip( zip ) {
 
 		const mainModelFiles = [
 			'scene.gltf', 'scene.glb', 'model.gltf', 'model.glb',
@@ -459,7 +457,6 @@ export class AssetLoader extends EventDispatcher {
 		if ( extension === 'gltf' ) {
 
 			const gltfContent = strFromU8( fileContent );
-			const gltfJson = JSON.parse( gltfContent );
 			const manager = new LoadingManager();
 			const gltfDir = filePath.split( '/' ).slice( 0, - 1 ).join( '/' );
 

package/src/Processor/EmissiveTriangleBuilder.js

@@ -50,12 +50,11 @@ export class EmissiveTriangleBuilder {
 			const material = materials[ materialIndex ];
 			if ( ! material ) continue;
 
-			// Check if emissive and visible
+			// Check if emissive
 			const emissive = material.emissive || { r: 0, g: 0, b: 0 };
 			const emissiveIntensity = material.emissiveIntensity || 0;
-			const isVisible = material.visible === undefined || material.visible !== 0;
 
-			const isEmissive = isVisible && emissiveIntensity > 0 && (
+			const isEmissive = emissiveIntensity > 0 && (
 				emissive.r > 0 || emissive.g > 0 || emissive.b > 0
 			);
 
@@ -410,8 +409,7 @@ export class EmissiveTriangleBuilder {
 
 		const emissive = material.emissive || { r: 0, g: 0, b: 0 };
 		const emissiveIntensity = material.emissiveIntensity || 0;
-		const isVisible = material.visible === undefined || material.visible !== 0;
-		const isNowEmissive = isVisible && emissiveIntensity > 0 && ( emissive.r > 0 || emissive.g > 0 || emissive.b > 0 );
+		const isNowEmissive = emissiveIntensity > 0 && ( emissive.r > 0 || emissive.g > 0 || emissive.b > 0 );
 
 		// Check if this material had any emissive triangles before
 		const hadEmissive = this.emissiveTriangles.some( t => t.materialIndex === materialIndex );

package/src/Processor/EquirectHDRInfo.js

@@ -1,4 +1,4 @@
-import { DataUtils, HalfFloatType, FloatType } from 'three';
+import { DataUtils, HalfFloatType, FloatType, SRGBColorSpace } from 'three';
 
 /**
  * Binary search to find the closest index
@@ -38,18 +38,35 @@ function colorToLuminance( r, g, b ) {
 
 }
 
+/**
+ * sRGB to linear conversion (IEC 61966-2-1 transfer function)
+ */
+function sRGBToLinear( c ) {
+
+	return c <= 0.04045 ? c / 12.92 : ( ( c + 0.055 ) / 1.055 ) ** 2.4;
+
+}
+
 /**
  * Extract Float32 RGBA pixel data from an environment map.
- * Handles HalfFloat/integer type conversion and Y-flip.
+ * Handles HalfFloat/integer type conversion, canvas extraction for
+ * non-DataTexture images (JPG/PNG), sRGB-to-linear conversion, and Y-flip.
  * @returns {{ floatData: Float32Array, width: number, height: number }}
  */
 export function extractFloatData( envMap ) {
 
-	const { width, height, data } = envMap.image;
+	const { width, height } = envMap.image;
+	let data = envMap.image.data;
+	let needsSRGBToLinear = false;
 
+	// No CPU-accessible data — extract from HTMLImageElement / ImageBitmap via canvas
 	if ( ! data ) {
 
-		throw new Error( 'EquirectHDRInfo: Environment map must have CPU-accessible image data. Render target textures are not supported.' );
+		const canvas = new OffscreenCanvas( width, height );
+		const ctx = canvas.getContext( '2d' );
+		ctx.drawImage( envMap.image, 0, 0, width, height );
+		data = ctx.getImageData( 0, 0, width, height ).data;
+		needsSRGBToLinear = true;
 
 	}
 
@@ -72,7 +89,7 @@ export function extractFloatData( envMap ) {
 
 	} else {
 
-		// Integer types (Uint8, Int16, etc.)
+		// Integer types (Uint8, Uint8Clamped, Int16, etc.)
 		let maxIntValue;
 		if ( data instanceof Int8Array || data instanceof Int16Array || data instanceof Int32Array ) {
 
@@ -93,6 +110,26 @@ export function extractFloatData( envMap ) {
 
 	}
 
+	// Also flag sRGB conversion for DataTextures explicitly marked as sRGB
+	if ( ! needsSRGBToLinear && envMap.colorSpace === SRGBColorSpace ) {
+
+		needsSRGBToLinear = true;
+
+	}
+
+	// Convert sRGB to linear so CDF luminance matches GPU-sampled linear values
+	if ( needsSRGBToLinear ) {
+
+		for ( let i = 0, l = floatData.length; i < l; i += 4 ) {
+
+			floatData[ i ] = sRGBToLinear( floatData[ i ] );
+			floatData[ i + 1 ] = sRGBToLinear( floatData[ i + 1 ] );
+			floatData[ i + 2 ] = sRGBToLinear( floatData[ i + 2 ] );
+
+		}
+
+	}
+
 	// Remove Y-flip for CDF computation
 	if ( envMap.flipY ) {
 

package/src/Processor/GeometryExtractor.js

@@ -114,7 +114,7 @@ export class GeometryExtractor {
 		}
 
 		// Process material and get its index
-		const materialIndex = this.processMaterial( mesh.material, mesh );
+		const materialIndex = this.processMaterial( mesh.material );
 		mesh.userData.materialIndex = materialIndex;
 
 		// Assign mesh index and store mesh reference
@@ -133,7 +133,7 @@ export class GeometryExtractor {
 
 	}
 
-	processMaterial( material, mesh = null ) {
+	processMaterial( material ) {
 
 		// Check if material already exists in our array (O(1) Map lookup)
 		let materialIndex = this._materialUuidMap.get( material.uuid ) ?? - 1;
@@ -148,7 +148,7 @@ export class GeometryExtractor {
 			}
 
 			// Create a new material object and add it to the array
-			const newMaterial = this.createMaterialObject( material, mesh );
+			const newMaterial = this.createMaterialObject( material );
 			this.materials.push( newMaterial );
 			materialIndex = this.materials.length - 1;
 			this._materialUuidMap.set( material.uuid, materialIndex );
@@ -327,7 +327,7 @@ export class GeometryExtractor {
 
 	}
 
-	createMaterialObject( material, mesh = null ) {
+	createMaterialObject( material ) {
 
 		const defaults = this.getPhysicalDefaults();
 		const materialType = this.getMaterialType( material );
@@ -407,8 +407,6 @@ export class GeometryExtractor {
 			// Rendering properties
 			side: this.getMaterialSide( material ),
 			depthWrite: material.depthWrite ?? true ? 1 : 0,
-			// Use mesh visibility if available, otherwise fall back to material or default to true
-			visible: mesh ? ( mesh.visible ? 1 : 0 ) : ( material.visible ?? true ? 1 : 0 ),
 
 			// Texture processing
 			map: this.processTexture( material.map, this.maps ),
@@ -757,7 +755,7 @@ export class GeometryExtractor {
 
 		if ( object.isMesh && object.geometry && object.material ) {
 
-			const materialIndex = this.processMaterial( object.material, object );
+			const materialIndex = this.processMaterial( object.material );
 			object.userData.materialIndex = materialIndex;
 
 			const meshIndex = this.meshes.length;

package/src/Processor/SceneProcessor.js

@@ -820,8 +820,8 @@ export class SceneProcessor {
 
 		// Factory method for creating any additional scene elements
 		// Currently returns an empty array by default
-		const white = new Color( 0xffffff );
-		const black = new Color( 0x000000 );
+		// const white = new Color( 0xffffff );
+		// const black = new Color( 0x000000 );
 		return [
 			// { position: new Vector3( - 4, 2, 0 ), radius: 0.8, material: { color: white, emissive: black, emissiveIntensity: 0, roughness: 1.0 } },
 			// { position: new Vector3( - 1.5, 2, 0 ), radius: 0.8, material: { color: white, emissive: black, emissiveIntensity: 0, roughness: 1.0 } },
@@ -1413,7 +1413,7 @@ export class SceneProcessor {
 	 * Returns null if no change, or the updated emissive data for GPU upload.
 	 *
 	 * @param {number} materialIndex
-	 * @param {string} property - 'emissive' | 'emissiveIntensity' | 'visible'
+	 * @param {string} property - 'emissive' | 'emissiveIntensity'
 	 * @param {*} value
 	 * @returns {{ rawData: Float32Array, emissiveCount: number, totalPower: number }|null}
 	 */
@@ -1426,7 +1426,6 @@ export class SceneProcessor {
 
 		if ( property === 'emissive' ) mat.emissive = value;
 		else if ( property === 'emissiveIntensity' ) mat.emissiveIntensity = value;
-		else if ( property === 'visible' ) mat.visible = value;
 
 		const changed = this.emissiveTriangleBuilder.updateMaterialEmissive(
 			materialIndex, mat,

package/src/Processor/ShaderBuilder.js

@@ -16,6 +16,7 @@ import { Fn, texture, vec2, float, int, uniform, If,
 import { TextureNode } from 'three/webgpu';
 import { LinearFilter, DataArrayTexture } from 'three';
 import { pathTracerMain } from '../TSL/PathTracer.js';
+import { setMeshVisibilityBuffer } from '../TSL/BVHTraversal.js';
 import { BuildTimer } from './BuildTimer.js';
 
 const WG_SIZE = 8;
@@ -188,6 +189,9 @@ export class ShaderBuilder {
 		const emissiveTriStorage = stage.emissiveTriangleStorageNode;
 		const lightBVHStorage = stage.lightBVHStorageNode;
 
+		// Set per-mesh visibility buffer (module-level in BVHTraversal.js, read during graph construction)
+		setMeshVisibilityBuffer( stage.meshVisibilityStorageNode );
+
 		const envTex = texture( stage.environment.environmentTexture );
 
 		// Adaptive sampling texture

package/src/Processor/TLASBuilder.js

@@ -268,7 +268,7 @@ export class TLASBuilder {
 				// Leaf node — BLAS pointer
 				const entry = entries[ n.entryIndex ];
 				data[ o ] = entry.blasOffset; // Absolute node index of BLAS root in combined buffer
-				// data[o+1] = 0
+				data[ o + 1 ] = n.entryIndex; // meshIndex for per-mesh visibility check
 				// data[o+2] = 0
 				data[ o + 3 ] = BVH_LEAF_MARKERS.BLAS_POINTER_LEAF; // -2 marker
 

package/src/Stages/PathTracer.js

@@ -188,6 +188,10 @@ export class PathTracer extends RenderStage {
 		this.lightBVHStorageAttr = new StorageInstancedBufferAttribute( new Float32Array( 16 ), 4 );
 		this.lightBVHStorageNode = storage( this.lightBVHStorageAttr, 'vec4', 1 ).toReadOnly();
 
+		// Per-mesh visibility (storage buffer for TLAS BLAS-pointer skip)
+		this.meshVisibilityStorageAttr = new StorageInstancedBufferAttribute( new Float32Array( [ 1, 0, 0, 0 ] ), 4 );
+		this.meshVisibilityStorageNode = storage( this.meshVisibilityStorageAttr, 'vec4', 1 ).toReadOnly();
+
 		// Adaptive sampling
 		this.adaptiveSamplingTexture = null;
 
@@ -480,6 +484,10 @@ export class PathTracer extends RenderStage {
 
 		}
 
+		// Per-mesh visibility — collect meshes from scene ordered by meshIndex
+		this._meshRefs = this._collectMeshRefs( this.scene );
+		this.setMeshVisibilityData( this._meshRefs );
+
 		// Spheres
 		this.spheres = this.sdfs.spheres || [];
 
@@ -759,6 +767,109 @@ export class PathTracer extends RenderStage {
 
 	}
 
+	/**
+	 * Build per-mesh visibility storage buffer from mesh world-visibility.
+	 * Each mesh gets one float (1.0 = visible, 0.0 = hidden).
+	 * Padded to vec4 alignment for GPU storage buffer compatibility.
+	 * @param {Array} meshes - Array of Three.js mesh objects
+	 */
+	setMeshVisibilityData( meshes ) {
+
+		if ( ! meshes || meshes.length === 0 ) return;
+
+		const meshCount = meshes.length;
+		// One vec4 per mesh — visibility stored in .x (simple indexing on GPU)
+		const data = new Float32Array( meshCount * 4 );
+
+		for ( let i = 0; i < meshCount; i ++ ) {
+
+			data[ i * 4 ] = this._isWorldVisible( meshes[ i ] ) ? 1.0 : 0.0;
+
+		}
+
+		this.meshVisibilityStorageAttr = new StorageInstancedBufferAttribute( data, 4 );
+		this.meshVisibilityStorageNode.value = this.meshVisibilityStorageAttr;
+		this.meshVisibilityStorageNode.bufferCount = meshCount;
+
+	}
+
+	/**
+	 * Update visibility for a single mesh in the GPU buffer (no rebuild).
+	 * @param {number} meshIndex
+	 * @param {boolean} visible
+	 */
+	updateMeshVisibility( meshIndex, visible ) {
+
+		if ( ! this.meshVisibilityStorageAttr ) return;
+
+		this.meshVisibilityStorageAttr.array[ meshIndex * 4 ] = visible ? 1.0 : 0.0;
+		this.meshVisibilityStorageAttr.needsUpdate = true;
+
+	}
+
+	/**
+	 * Recompute world-visibility for all meshes and update the GPU buffer.
+	 * Call this when group visibility changes at runtime.
+	 */
+	updateAllMeshVisibility() {
+
+		if ( ! this._meshRefs || ! this.meshVisibilityStorageAttr ) return;
+
+		const data = this.meshVisibilityStorageAttr.array;
+		for ( let i = 0; i < this._meshRefs.length; i ++ ) {
+
+			data[ i * 4 ] = this._isWorldVisible( this._meshRefs[ i ] ) ? 1.0 : 0.0;
+
+		}
+
+		this.meshVisibilityStorageAttr.needsUpdate = true;
+
+	}
+
+	/**
+	 * Collect mesh references from scene, ordered by meshIndex (assigned during extraction).
+	 * @param {Object3D} scene
+	 * @returns {Array}
+	 * @private
+	 */
+	_collectMeshRefs( scene ) {
+
+		if ( ! scene ) return [];
+
+		const meshes = [];
+		scene.traverse( obj => {
+
+			if ( obj.isMesh && obj.userData.meshIndex !== undefined ) {
+
+				meshes[ obj.userData.meshIndex ] = obj;
+
+			}
+
+		} );
+
+		return meshes;
+
+	}
+
+	/**
+	 * Walk the parent chain to determine world-space visibility.
+	 * @param {Object3D} object
+	 * @returns {boolean}
+	 * @private
+	 */
+	_isWorldVisible( object ) {
+
+		while ( object ) {
+
+			if ( ! object.visible ) return false;
+			object = object.parent;
+
+		}
+
+		return true;
+
+	}
+
 	// ===== FAST BUFFER UPDATES (BVH Refit / Animation) =====
 
 	/**