super-three 0.169.1 → 0.170.1

package/examples/jsm/tsl/display/FXAANode.js

@@ -0,0 +1,316 @@
+import { Vector2, TempNode } from 'three/webgpu';
+import { nodeObject, Fn, uniformArray, select, float, NodeUpdateType, uv, dot, clamp, uniform, convertToTexture, smoothstep, bool, vec2, vec3, If, Loop, max, min, Break, abs } from 'three/tsl';
+
+class FXAANode extends TempNode {
+
+	static get type() {
+
+		return 'FXAANode';
+
+	}
+
+	constructor( textureNode ) {
+
+		super( 'vec4' );
+
+		this.textureNode = textureNode;
+
+		this.updateBeforeType = NodeUpdateType.FRAME;
+
+		this._invSize = uniform( new Vector2() );
+
+	}
+
+	updateBefore() {
+
+		const map = this.textureNode.value;
+
+		this._invSize.value.set( 1 / map.image.width, 1 / map.image.height );
+
+	}
+
+	setup() {
+
+		const textureNode = this.textureNode.bias( - 100 );
+		const uvNode = textureNode.uvNode || uv();
+
+		const EDGE_STEP_COUNT = float( 6 );
+		const EDGE_GUESS = float( 8.0 );
+		const EDGE_STEPS = uniformArray( [ 1.0, 1.5, 2.0, 2.0, 2.0, 4.0 ] );
+
+		const _ContrastThreshold = float( 0.0312 );
+		const _RelativeThreshold = float( 0.063 );
+		const _SubpixelBlending = float( 1.0 );
+
+		const Sample = Fn( ( [ uv ] ) => {
+
+			return textureNode.uv( uv );
+
+		} );
+
+		const SampleLuminance = Fn( ( [ uv ] ) => {
+
+			return dot( Sample( uv ).rgb, vec3( 0.3, 0.59, 0.11 ) );
+
+		} );
+
+		const SampleLuminanceOffset = Fn( ( [ texSize, uv, uOffset, vOffset ] ) => {
+
+			const shiftedUv = uv.add( texSize.mul( vec2( uOffset, vOffset ) ) );
+			return SampleLuminance( shiftedUv );
+
+		} );
+
+		const ShouldSkipPixel = ( l ) => {
+
+			const threshold = max( _ContrastThreshold, _RelativeThreshold.mul( l.highest ) );
+			return l.contrast.lessThan( threshold );
+
+		};
+
+		const SampleLuminanceNeighborhood = ( texSize, uv ) => {
+
+			const m = SampleLuminance( uv );
+
+			const n = SampleLuminanceOffset( texSize, uv, 0.0, - 1.0 );
+			const e = SampleLuminanceOffset( texSize, uv, 1.0, 0.0 );
+			const s = SampleLuminanceOffset( texSize, uv, 0.0, 1.0 );
+			const w = SampleLuminanceOffset( texSize, uv, - 1.0, 0.0 );
+
+			const ne = SampleLuminanceOffset( texSize, uv, 1.0, - 1.0 );
+			const nw = SampleLuminanceOffset( texSize, uv, - 1.0, - 1.0 );
+			const se = SampleLuminanceOffset( texSize, uv, 1.0, 1.0 );
+			const sw = SampleLuminanceOffset( texSize, uv, - 1.0, 1.0 );
+
+			const highest = max( max( max( max( s, e ), n ), w ), m );
+			const lowest = min( min( min( min( s, e ), n ), w ), m );
+			const contrast = highest.sub( lowest );
+
+			return { m, n, e, s, w, ne, nw, se, sw, highest, lowest, contrast };
+
+		};
+
+		const DeterminePixelBlendFactor = ( l ) => {
+
+			let f = float( 2.0 ).mul( l.s.add( l.e ).add( l.n ).add( l.w ) );
+			f = f.add( l.se.add( l.sw ).add( l.ne ).add( l.nw ) );
+			f = f.mul( 1.0 / 12.0 );
+			f = abs( f.sub( l.m ) );
+			f = clamp( f.div( max( l.contrast, 0 ) ), 0.0, 1.0 );
+
+			const blendFactor = smoothstep( 0.0, 1.0, f );
+			return blendFactor.mul( blendFactor ).mul( _SubpixelBlending );
+
+		};
+
+		const DetermineEdge = ( texSize, l ) => {
+
+			const horizontal =
+				abs( l.s.add( l.n ).sub( l.m.mul( 2.0 ) ) ).mul( 2.0 ).add(
+					abs( l.se.add( l.ne ).sub( l.e.mul( 2.0 ) ) ).add(
+						abs( l.sw.add( l.nw ).sub( l.w.mul( 2.0 ) ) )
+					)
+				);
+
+			const vertical =
+				abs( l.e.add( l.w ).sub( l.m.mul( 2.0 ) ) ).mul( 2.0 ).add(
+					abs( l.se.add( l.sw ).sub( l.s.mul( 2.0 ) ) ).add(
+						abs( l.ne.add( l.nw ).sub( l.n.mul( 2.0 ) ) )
+					)
+				);
+
+			const isHorizontal = horizontal.greaterThanEqual( vertical );
+
+			const pLuminance = select( isHorizontal, l.s, l.e );
+			const nLuminance = select( isHorizontal, l.n, l.w );
+			const pGradient = abs( pLuminance.sub( l.m ) );
+			const nGradient = abs( nLuminance.sub( l.m ) );
+
+			const pixelStep = select( isHorizontal, texSize.y, texSize.x ).toVar();
+			const oppositeLuminance = float().toVar();
+			const gradient = float().toVar();
+
+			If( pGradient.lessThan( nGradient ), () => {
+
+				pixelStep.assign( pixelStep.negate() );
+				oppositeLuminance.assign( nLuminance );
+				gradient.assign( nGradient );
+
+			} ).Else( () => {
+
+				oppositeLuminance.assign( pLuminance );
+				gradient.assign( pGradient );
+
+			} );
+
+			return { isHorizontal, pixelStep, oppositeLuminance, gradient };
+
+		};
+
+		const DetermineEdgeBlendFactor = ( texSize, l, e, uv ) => {
+
+			const uvEdge = uv.toVar();
+			const edgeStep = vec2().toVar();
+			If( e.isHorizontal, () => {
+
+				uvEdge.y.addAssign( e.pixelStep.mul( 0.5 ) );
+				edgeStep.assign( vec2( texSize.x, 0.0 ) );
+
+			} ).Else( () => {
+
+				uvEdge.x.addAssign( e.pixelStep.mul( 0.5 ) );
+				edgeStep.assign( vec2( 0.0, texSize.y ) );
+
+			} );
+
+			const edgeLuminance = l.m.add( e.oppositeLuminance ).mul( 0.5 );
+			const gradientThreshold = e.gradient.mul( 0.25 );
+
+			const puv = uvEdge.add( edgeStep.mul( EDGE_STEPS.element( 0 ) ) ).toVar();
+			const pLuminanceDelta = SampleLuminance( puv ).sub( edgeLuminance ).toVar();
+			const pAtEnd = abs( pLuminanceDelta ).greaterThanEqual( gradientThreshold ).toVar();
+
+			Loop( { start: 1, end: EDGE_STEP_COUNT }, ( { i } ) => {
+
+				If( pAtEnd, () => {
+
+					Break();
+
+				} );
+
+				puv.addAssign( edgeStep.mul( EDGE_STEPS.element( i ) ) );
+				pLuminanceDelta.assign( SampleLuminance( puv ).sub( edgeLuminance ) );
+				pAtEnd.assign( abs( pLuminanceDelta ).greaterThanEqual( gradientThreshold ) );
+
+			} );
+
+			If( pAtEnd.not(), () => {
+
+				puv.addAssign( edgeStep.mul( EDGE_GUESS ) );
+
+			} );
+
+			const nuv = uvEdge.sub( edgeStep.mul( EDGE_STEPS.element( 0 ) ) ).toVar();
+			const nLuminanceDelta = SampleLuminance( nuv ).sub( edgeLuminance ).toVar();
+			const nAtEnd = abs( nLuminanceDelta ).greaterThanEqual( gradientThreshold ).toVar();
+
+			Loop( { start: 1, end: EDGE_STEP_COUNT }, ( { i } ) => {
+
+				If( nAtEnd, () => {
+
+					Break();
+
+				} );
+
+				nuv.subAssign( edgeStep.mul( EDGE_STEPS.element( i ) ) );
+				nLuminanceDelta.assign( SampleLuminance( nuv ).sub( edgeLuminance ) );
+				nAtEnd.assign( abs( nLuminanceDelta ).greaterThanEqual( gradientThreshold ) );
+
+			} );
+
+			If( nAtEnd.not(), () => {
+
+				nuv.subAssign( edgeStep.mul( EDGE_GUESS ) );
+
+			} );
+
+			const pDistance = float().toVar();
+			const nDistance = float().toVar();
+
+			If( e.isHorizontal, () => {
+
+				pDistance.assign( puv.x.sub( uv.x ) );
+				nDistance.assign( uv.x.sub( nuv.x ) );
+
+			} ).Else( () => {
+
+				pDistance.assign( puv.y.sub( uv.y ) );
+				nDistance.assign( uv.y.sub( nuv.y ) );
+
+			} );
+
+			const shortestDistance = float().toVar();
+			const deltaSign = bool().toVar();
+
+			If( pDistance.lessThanEqual( nDistance ), () => {
+
+				shortestDistance.assign( pDistance );
+				deltaSign.assign( pLuminanceDelta.greaterThanEqual( 0.0 ) );
+
+			} ).Else( () => {
+
+				shortestDistance.assign( nDistance );
+				deltaSign.assign( nLuminanceDelta.greaterThanEqual( 0.0 ) );
+
+			} );
+
+			const blendFactor = float().toVar();
+
+			If( deltaSign.equal( l.m.sub( edgeLuminance ).greaterThanEqual( 0.0 ) ), () => {
+
+				blendFactor.assign( 0.0 );
+
+			} ).Else( () => {
+
+				blendFactor.assign( float( 0.5 ).sub( shortestDistance.div( pDistance.add( nDistance ) ) ) );
+
+			} );
+
+			return blendFactor;
+
+		};
+
+		const ApplyFXAA = Fn( ( [ uv, texSize ] ) => {
+
+			const luminance = SampleLuminanceNeighborhood( texSize, uv );
+			If( ShouldSkipPixel( luminance ), () => {
+
+				return Sample( uv );
+
+			} );
+
+			const pixelBlend = DeterminePixelBlendFactor( luminance );
+			const edge = DetermineEdge( texSize, luminance );
+			const edgeBlend = DetermineEdgeBlendFactor( texSize, luminance, edge, uv );
+
+			const finalBlend = max( pixelBlend, edgeBlend );
+			const finalUv = uv.toVar();
+
+			If( edge.isHorizontal, () => {
+
+				finalUv.y.addAssign( edge.pixelStep.mul( finalBlend ) );
+
+			} ).Else( () => {
+
+				finalUv.x.addAssign( edge.pixelStep.mul( finalBlend ) );
+
+			} );
+
+			return Sample( finalUv );
+
+		} ).setLayout( {
+			name: 'FxaaPixelShader',
+			type: 'vec4',
+			inputs: [
+				{ name: 'uv', type: 'vec2' },
+				{ name: 'texSize', type: 'vec2' },
+			]
+		} );
+
+		const fxaa = Fn( () => {
+
+			return ApplyFXAA( uvNode, this._invSize );
+
+		} );
+
+		const outputNode = fxaa();
+
+		return outputNode;
+
+	}
+
+}
+
+export default FXAANode;
+
+export const fxaa = ( node ) => nodeObject( new FXAANode( convertToTexture( node ) ) );

package/{src/nodes → examples/jsm/tsl}/display/FilmNode.js

@@ -1,8 +1,5 @@
-import TempNode from '../core/TempNode.js';
-import { uv } from '../accessors/UV.js';
-import { Fn, nodeProxy, vec4 } from '../tsl/TSLBase.js';
-import { mix, fract, clamp, rand } from '../math/MathNode.js';
-import { timerLocal } from '../utils/TimerNode.js';
+import { TempNode } from 'three/webgpu';
+import { rand, Fn, fract, time, uv, clamp, mix, vec4, nodeProxy } from 'three/tsl';
 
 class FilmNode extends TempNode {
 
@@ -14,7 +11,7 @@ class FilmNode extends TempNode {
 
 	constructor( inputNode, intensityNode = null, uvNode = null ) {
 
-		super();
+		super( 'vec4' );
 
 		this.inputNode = inputNode;
 		this.intensityNode = intensityNode;
@@ -29,7 +26,7 @@ class FilmNode extends TempNode {
 		const film = Fn( () => {
 
 			const base = this.inputNode.rgb;
-			const noise = rand( fract( uvNode.add( timerLocal() ) ) );
+			const noise = rand( fract( uvNode.add( time ) ) );
 
 			let color = base.add( base.mul( clamp( noise.add( 0.1 ), 0, 1 ) ) );
 

package/{src/nodes → examples/jsm/tsl}/display/GTAONode.js

@@ -1,28 +1,15 @@
-import TempNode from '../core/TempNode.js';
-import { texture } from '../accessors/TextureNode.js';
-import { textureSize } from '../accessors/TextureSizeNode.js';
-import { uv } from '../accessors/UV.js';
-import { nodeObject, Fn, mat3, vec2, vec3, vec4, float, int, If } from '../tsl/TSLBase.js';
-import { NodeUpdateType } from '../core/constants.js';
-import { uniform } from '../core/UniformNode.js';
-import { DataTexture } from '../../textures/DataTexture.js';
-import { Vector2 } from '../../math/Vector2.js';
-import { Vector3 } from '../../math/Vector3.js';
-import { PI, cos, sin, pow, clamp, abs, max, mix, sqrt, acos, dot, normalize, cross } from '../math/MathNode.js';
-import { div, mul, add, sub } from '../math/OperatorNode.js';
-import { Loop } from '../utils/LoopNode.js';
-import { passTexture } from './PassNode.js';
-import { RepeatWrapping } from '../../constants.js';
-import QuadMesh from '../../renderers/common/QuadMesh.js';
-import NodeMaterial from '../../materials/nodes/NodeMaterial.js';
-
-import { RenderTarget } from '../../core/RenderTarget.js';
-import { Color } from '../../math/Color.js';
+import { DataTexture, RenderTarget, RepeatWrapping, Vector2, Vector3, TempNode, QuadMesh, NodeMaterial, PostProcessingUtils } from 'three/webgpu';
+import { reference, logarithmicDepthToViewZ, viewZToPerspectiveDepth, getNormalFromDepth, getScreenPosition, getViewPosition, nodeObject, Fn, float, NodeUpdateType, uv, uniform, Loop, vec2, vec3, vec4, int, dot, max, pow, abs, If, textureSize, sin, cos, PI, texture, passTexture, mat3, add, normalize, mul, cross, div, mix, sqrt, sub, acos, clamp } from 'three/tsl';
 
 const _quadMesh = /*@__PURE__*/ new QuadMesh();
-const _currentClearColor = /*@__PURE__*/ new Color();
 const _size = /*@__PURE__*/ new Vector2();
 
+let _rendererState;
+
+/**
+ * References:
+ * https://www.activision.com/cdn/research/Practical_Real_Time_Strategies_for_Accurate_Indirect_Occlusion_NEW%20VERSION_COLOR.pdf
+ */
 class GTAONode extends TempNode {
 
 	static get type() {
@@ -33,31 +20,44 @@ class GTAONode extends TempNode {
 
 	constructor( depthNode, normalNode, camera ) {
 
-		super();
+		super( 'vec4' );
 
 		this.depthNode = depthNode;
 		this.normalNode = normalNode;
 
+		this.resolutionScale = 1;
+
+		this.updateBeforeType = NodeUpdateType.FRAME;
+
+		// render targets
+
+		this._aoRenderTarget = new RenderTarget( 1, 1, { depthBuffer: false } );
+		this._aoRenderTarget.texture.name = 'GTAONode.AO';
+
+		// uniforms
+
 		this.radius = uniform( 0.25 );
 		this.resolution = uniform( new Vector2() );
 		this.thickness = uniform( 1 );
 		this.distanceExponent = uniform( 1 );
 		this.distanceFallOff = uniform( 1 );
 		this.scale = uniform( 1 );
-		this.noiseNode = texture( generateMagicSquareNoise() );
+		this.samples = uniform( 16 );
 
-		this.cameraProjectionMatrix = uniform( camera.projectionMatrix );
-		this.cameraProjectionMatrixInverse = uniform( camera.projectionMatrixInverse );
+		this._noiseNode = texture( generateMagicSquareNoise() );
+		this._cameraProjectionMatrix = uniform( camera.projectionMatrix );
+		this._cameraProjectionMatrixInverse = uniform( camera.projectionMatrixInverse );
+		this._cameraNear = reference( 'near', 'float', camera );
+		this._cameraFar = reference( 'far', 'float', camera );
 
-		this.SAMPLES = uniform( 16 );
+		// materials
 
-		this._aoRenderTarget = new RenderTarget();
-		this._aoRenderTarget.texture.name = 'GTAONode.AO';
+		this._material = new NodeMaterial();
+		this._material.name = 'GTAO';
 
-		this._material = null;
-		this._textureNode = passTexture( this, this._aoRenderTarget.texture );
+		//
 
-		this.updateBeforeType = NodeUpdateType.FRAME;
+		this._textureNode = passTexture( this, this._aoRenderTarget.texture );
 
 	}
 
@@ -69,6 +69,9 @@ class GTAONode extends TempNode {
 
 	setSize( width, height ) {
 
+		width = Math.round( this.resolutionScale * width );
+		height = Math.round( this.resolutionScale * height );
+
 		this.resolution.value.set( width, height );
 		this._aoRenderTarget.setSize( width, height );
 
@@ -78,20 +81,17 @@ class GTAONode extends TempNode {
 
 		const { renderer } = frame;
 
-		const size = renderer.getDrawingBufferSize( _size );
-
-		const currentRenderTarget = renderer.getRenderTarget();
-		const currentMRT = renderer.getMRT();
-		renderer.getClearColor( _currentClearColor );
-		const currentClearAlpha = renderer.getClearAlpha();
+		_rendererState = PostProcessingUtils.resetRendererState( renderer, _rendererState );
 
-		_quadMesh.material = this._material;
+		//
 
+		const size = renderer.getDrawingBufferSize( _size );
 		this.setSize( size.width, size.height );
 
+		_quadMesh.material = this._material;
+
 		// clear
 
-		renderer.setMRT( null );
 		renderer.setClearColor( 0xffffff, 1 );
 
 		// ao
@@ -101,9 +101,7 @@ class GTAONode extends TempNode {
 
 		// restore
 
-		renderer.setRenderTarget( currentRenderTarget );
-		renderer.setMRT( currentMRT );
-		renderer.setClearColor( _currentClearColor, currentClearAlpha );
+		PostProcessingUtils.restoreRendererState( renderer, _rendererState );
 
 	}
 
@@ -111,42 +109,37 @@ class GTAONode extends TempNode {
 
 		const uvNode = uv();
 
-		const sampleDepth = ( uv ) => this.depthNode.uv( uv ).x;
-		const sampleNoise = ( uv ) => this.noiseNode.uv( uv );
+		const sampleDepth = ( uv ) => {
 
-		const getSceneUvAndDepth = Fn( ( [ sampleViewPos ] )=> {
+			const depth = this.depthNode.uv( uv ).r;
 
-			const sampleClipPos = this.cameraProjectionMatrix.mul( vec4( sampleViewPos, 1.0 ) );
-			let sampleUv = sampleClipPos.xy.div( sampleClipPos.w ).mul( 0.5 ).add( 0.5 ).toVar();
-			sampleUv = vec2( sampleUv.x, sampleUv.y.oneMinus() );
-			const sampleSceneDepth = sampleDepth( sampleUv );
-			return vec3( sampleUv, sampleSceneDepth );
+			if ( builder.renderer.logarithmicDepthBuffer === true ) {
 
-		} );
+				const viewZ = logarithmicDepthToViewZ( depth, this._cameraNear, this._cameraFar );
 
-		const getViewPosition = Fn( ( [ screenPosition, depth ] ) => {
+				return viewZToPerspectiveDepth( viewZ, this._cameraNear, this._cameraFar );
 
-			screenPosition = vec2( screenPosition.x, screenPosition.y.oneMinus() ).mul( 2.0 ).sub( 1.0 );
+			}
 
-			const clipSpacePosition = vec4( vec3( screenPosition, depth ), 1.0 );
-			const viewSpacePosition = vec4( this.cameraProjectionMatrixInverse.mul( clipSpacePosition ) );
+			return depth;
 
-			return viewSpacePosition.xyz.div( viewSpacePosition.w );
+		};
 
-		} );
+		const sampleNoise = ( uv ) => this._noiseNode.uv( uv );
+		const sampleNormal = ( uv ) => ( this.normalNode !== null ) ? this.normalNode.uv( uv ).rgb.normalize() : getNormalFromDepth( uv, this.depthNode.value, this._cameraProjectionMatrixInverse );
 
 		const ao = Fn( () => {
 
-			const depth = sampleDepth( uvNode );
+			const depth = sampleDepth( uvNode ).toVar();
 
 			depth.greaterThanEqual( 1.0 ).discard();
 
-			const viewPosition = getViewPosition( uvNode, depth );
-			const viewNormal = this.normalNode.rgb.normalize();
+			const viewPosition = getViewPosition( uvNode, depth, this._cameraProjectionMatrixInverse ).toVar();
+			const viewNormal = sampleNormal( uvNode ).toVar();
 
 			const radiusToUse = this.radius;
 
-			const noiseResolution = textureSize( this.noiseNode, 0 );
+			const noiseResolution = textureSize( this._noiseNode, 0 );
 			let noiseUv = vec2( uvNode.x, uvNode.y.oneMinus() );
 			noiseUv = noiseUv.mul( this.resolution.div( noiseResolution ) );
 			const noiseTexel = sampleNoise( noiseUv );
@@ -155,23 +148,23 @@ class GTAONode extends TempNode {
 			const bitangent = vec3( tangent.y.mul( - 1.0 ), tangent.x, 0.0 );
 			const kernelMatrix = mat3( tangent, bitangent, vec3( 0.0, 0.0, 1.0 ) );
 
-			const DIRECTIONS = this.SAMPLES.lessThan( 30 ).select( 3, 5 );
-			const STEPS = add( this.SAMPLES, DIRECTIONS.sub( 1 ) ).div( DIRECTIONS );
+			const DIRECTIONS = this.samples.lessThan( 30 ).select( 3, 5 ).toVar();
+			const STEPS = add( this.samples, DIRECTIONS.sub( 1 ) ).div( DIRECTIONS ).toVar();
 
 			const ao = float( 0 ).toVar();
 
 			Loop( { start: int( 0 ), end: DIRECTIONS, type: 'int', condition: '<' }, ( { i } ) => {
 
-				const angle = float( i ).div( float( DIRECTIONS ) ).mul( PI );
+				const angle = float( i ).div( float( DIRECTIONS ) ).mul( PI ).toVar();
 				const sampleDir = vec4( cos( angle ), sin( angle ), 0., add( 0.5, mul( 0.5, noiseTexel.w ) ) );
 				sampleDir.xyz = normalize( kernelMatrix.mul( sampleDir.xyz ) );
 
-				const viewDir = normalize( viewPosition.xyz.negate() );
-				const sliceBitangent = normalize( cross( sampleDir.xyz, viewDir ) );
+				const viewDir = normalize( viewPosition.xyz.negate() ).toVar();
+				const sliceBitangent = normalize( cross( sampleDir.xyz, viewDir ) ).toVar();
 				const sliceTangent = cross( sliceBitangent, viewDir );
 				const normalInSlice = normalize( viewNormal.sub( sliceBitangent.mul( dot( viewNormal, sliceBitangent ) ) ) );
 
-				const tangentToNormalInSlice = cross( normalInSlice, sliceBitangent );
+				const tangentToNormalInSlice = cross( normalInSlice, sliceBitangent ).toVar();
 				const cosHorizons = vec2( dot( viewDir, tangentToNormalInSlice ), dot( viewDir, tangentToNormalInSlice.negate() ) ).toVar();
 
 				Loop( { end: STEPS, type: 'int', name: 'j', condition: '<' }, ( { j } ) => {
@@ -180,9 +173,10 @@ class GTAONode extends TempNode {
 
 					// x
 
-					const sampleSceneUvDepthX = getSceneUvAndDepth( viewPosition.add( sampleViewOffset ) );
-					const sampleSceneViewPositionX = getViewPosition( sampleSceneUvDepthX.xy, sampleSceneUvDepthX.z );
-					const viewDeltaX = sampleSceneViewPositionX.sub( viewPosition );
+					const sampleScreenPositionX = getScreenPosition( viewPosition.add( sampleViewOffset ), this._cameraProjectionMatrix ).toVar();
+					const sampleDepthX = sampleDepth( sampleScreenPositionX ).toVar();
+					const sampleSceneViewPositionX = getViewPosition( sampleScreenPositionX, sampleDepthX, this._cameraProjectionMatrixInverse ).toVar();
+					const viewDeltaX = sampleSceneViewPositionX.sub( viewPosition ).toVar();
 
 					If( abs( viewDeltaX.z ).lessThan( this.thickness ), () => {
 
@@ -193,9 +187,10 @@ class GTAONode extends TempNode {
 
 					// y
 
-					const sampleSceneUvDepthY = getSceneUvAndDepth( viewPosition.sub( sampleViewOffset ) );
-					const sampleSceneViewPositionY = getViewPosition( sampleSceneUvDepthY.xy, sampleSceneUvDepthY.z );
-					const viewDeltaY = sampleSceneViewPositionY.sub( viewPosition );
+					const sampleScreenPositionY = getScreenPosition( viewPosition.sub( sampleViewOffset ), this._cameraProjectionMatrix ).toVar();
+					const sampleDepthY = sampleDepth( sampleScreenPositionY ).toVar();
+					const sampleSceneViewPositionY = getViewPosition( sampleScreenPositionY, sampleDepthY, this._cameraProjectionMatrixInverse ).toVar();
+					const viewDeltaY = sampleSceneViewPositionY.sub( viewPosition ).toVar();
 
 					If( abs( viewDeltaY.z ).lessThan( this.thickness ), () => {
 
@@ -206,7 +201,7 @@ class GTAONode extends TempNode {
 
 				} );
 
-				const sinHorizons = sqrt( sub( 1.0, cosHorizons.mul( cosHorizons ) ) );
+				const sinHorizons = sqrt( sub( 1.0, cosHorizons.mul( cosHorizons ) ) ).toVar();
 				const nx = dot( normalInSlice, sliceTangent );
 				const ny = dot( normalInSlice, viewDir );
 				const nxb = mul( 0.5, acos( cosHorizons.y ).sub( acos( cosHorizons.x ) ).add( sinHorizons.x.mul( cosHorizons.x ).sub( sinHorizons.y.mul( cosHorizons.y ) ) ) );
@@ -223,10 +218,8 @@ class GTAONode extends TempNode {
 
 		} );
 
-		const material = this._material || ( this._material = new NodeMaterial() );
-		material.fragmentNode = ao().context( builder.getSharedContext() );
-		material.name = 'GTAO';
-		material.needsUpdate = true;
+		this._material.fragmentNode = ao().context( builder.getSharedContext() );
+		this._material.needsUpdate = true;
 
 		//
 
@@ -238,6 +231,8 @@ class GTAONode extends TempNode {
 
 		this._aoRenderTarget.dispose();
 
+		this._material.dispose();
+
 	}
 
 }