Skip to content

Commit 0d57860

Browse files
sunagsunag
authored
TSL: Vertex shader revision (#30108)
* vertex shader revision * revision * cleanup * Update Three.TSL.js * Update webgpu_instance_sprites.jpg * Update webgpu_tsl_galaxy.jpg * renames
1 parent 234945c commit 0d57860

File tree

13 files changed

+66
-82
lines changed

13 files changed

+66
-82
lines changed

‎examples/jsm/materials/LDrawConditionalLineNodeMaterial.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -50,7 +50,7 @@ class LDrawConditionalLineMaterial extends NodeMaterial {
5050

5151
varyingProperty( 'float', 'discardFlag' ).assign( discardFlag );
5252

53-
return modelViewProjection();
53+
return modelViewProjection;
5454

5555
} )();
5656

‎examples/jsm/objects/SkyMesh.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -98,7 +98,7 @@ class SkyMesh extends Mesh {
9898

9999
// position
100100

101-
const position = modelViewProjection();
101+
const position = modelViewProjection;
102102
position.z.assign( position.w ); // set z to camera.far
103103

104104
return position;

‎examples/jsm/tsl/display/SMAANode.js‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -178,7 +178,7 @@ class SMAANode extends TempNode {
178178
varyingProperty( 'vec4', 'vOffset1' ).assign( vOffset1 );
179179
varyingProperty( 'vec4', 'vOffset2' ).assign( vOffset2 );
180180

181-
return modelViewProjection();
181+
return modelViewProjection;
182182

183183
} );
184184

@@ -405,7 +405,7 @@ class SMAANode extends TempNode {
405405
varyingProperty( 'vec4', 'vOffset1' ).assign( vOffset1 );
406406
varyingProperty( 'vec4', 'vOffset2' ).assign( vOffset2 );
407407

408-
return modelViewProjection();
408+
return modelViewProjection;
409409

410410
} );
411411

@@ -507,7 +507,7 @@ class SMAANode extends TempNode {
507507
//varyingProperty( 'vec4', 'vOffset0' ).assign( vOffset0 );
508508
varyingProperty( 'vec4', 'vOffset1' ).assign( vOffset1 );
509509

510-
return modelViewProjection();
510+
return modelViewProjection;
511511

512512
} );
513513

‎examples/screenshots/webgpu_instance_sprites.jpg‎

79 KB
Loading

‎examples/screenshots/webgpu_tsl_galaxy.jpg‎

24.2 KB
Loading

‎src/Three.TSL.js‎

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -183,8 +183,8 @@ export const grayscale = TSL.grayscale;
183183
export const greaterThan = TSL.greaterThan;
184184
export const greaterThanEqual = TSL.greaterThanEqual;
185185
export const hash = TSL.hash;
186-
export const highPrecisionModelNormalViewMatrix = TSL.highPrecisionModelNormalViewMatrix;
187-
export const highPrecisionModelViewMatrix = TSL.highPrecisionModelViewMatrix;
186+
export const highpModelNormalViewMatrix = TSL.highpModelNormalViewMatrix;
187+
export const highpModelViewMatrix = TSL.highpModelViewMatrix;
188188
export const hue = TSL.hue;
189189
export const instance = TSL.instance;
190190
export const instanceIndex = TSL.instanceIndex;
@@ -223,6 +223,7 @@ export const log2 = TSL.log2;
223223
export const logarithmicDepthToViewZ = TSL.logarithmicDepthToViewZ;
224224
export const loop = TSL.loop;
225225
export const luminance = TSL.luminance;
226+
export const mediumpModelViewMatrix = TSL.mediumpModelViewMatrix;
226227
export const mat2 = TSL.mat2;
227228
export const mat3 = TSL.mat3;
228229
export const mat4 = TSL.mat4;

‎src/materials/nodes/NodeMaterial.js‎

Lines changed: 23 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -23,6 +23,7 @@ import { cameraFar, cameraNear } from '../../nodes/accessors/Camera.js';
2323
import { clipping, clippingAlpha, hardwareClipping } from '../../nodes/accessors/ClippingNode.js';
2424
import NodeMaterialObserver from './manager/NodeMaterialObserver.js';
2525
import getAlphaHashThreshold from '../../nodes/functions/material/getAlphaHashThreshold.js';
26+
import { modelViewMatrix } from '../../nodes/accessors/ModelNode.js';
2627

2728
class NodeMaterial extends Material {
2829

@@ -100,6 +101,7 @@ class NodeMaterial extends Material {
100101
setup( builder ) {
101102

102103
builder.context.setupNormal = () => this.setupNormal( builder );
104+
builder.context.setupPositionView = () => this.setupPositionView( builder );
103105

104106
const renderer = builder.renderer;
105107
const renderTarget = renderer.getRenderTarget();
@@ -108,7 +110,9 @@ class NodeMaterial extends Material {
108110

109111
builder.addStack();
110112

111-
builder.stack.outputNode = this.vertexNode || this.setupPosition( builder );
113+
const vertexNode = this.vertexNode || this.setupVertex( builder );
114+
115+
builder.stack.outputNode = vertexNode;
112116

113117
this.setupHardwareClipping( builder );
114118

@@ -307,14 +311,27 @@ class NodeMaterial extends Material {
307311

308312
}
309313

310-
setupPosition( builder ) {
314+
setupPositionView() {
315+
316+
return modelViewMatrix.mul( positionLocal ).xyz;
317+
318+
}
311319

312-
const { object } = builder;
313-
const geometry = object.geometry;
320+
setupVertex( builder ) {
314321

315322
builder.addStack();
316323

317-
// Vertex
324+
this.setupPosition( builder );
325+
326+
builder.context.vertex = builder.removeStack();
327+
328+
return modelViewProjection;
329+
330+
}
331+
332+
setupPosition( builder ) {
333+
334+
const { object, geometry } = builder;
318335

319336
if ( geometry.morphAttributes.position || geometry.morphAttributes.normal || geometry.morphAttributes.color ) {
320337

@@ -356,12 +373,7 @@ class NodeMaterial extends Material {
356373

357374
}
358375

359-
const mvp = modelViewProjection();
360-
361-
builder.context.vertex = builder.removeStack();
362-
builder.context.mvp = mvp;
363-
364-
return mvp;
376+
return positionLocal;
365377

366378
}
367379

‎src/materials/nodes/SpriteNodeMaterial.js‎

Lines changed: 9 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -2,9 +2,9 @@ import NodeMaterial from './NodeMaterial.js';
22
import { cameraProjectionMatrix } from '../../nodes/accessors/Camera.js';
33
import { materialRotation } from '../../nodes/accessors/MaterialNode.js';
44
import { modelViewMatrix, modelWorldMatrix } from '../../nodes/accessors/ModelNode.js';
5-
import { positionLocal } from '../../nodes/accessors/Position.js';
5+
import { positionGeometry, positionLocal } from '../../nodes/accessors/Position.js';
66
import { rotate } from '../../nodes/utils/RotateNode.js';
7-
import { float, vec2, vec3, vec4 } from '../../nodes/tsl/TSLBase.js';
7+
import { float, vec2, vec4 } from '../../nodes/tsl/TSLBase.js';
88

99
import { SpriteMaterial } from '../SpriteMaterial.js';
1010
import { reference } from '../../nodes/accessors/ReferenceBaseNode.js';
@@ -38,17 +38,17 @@ class SpriteNodeMaterial extends NodeMaterial {
3838

3939
}
4040

41-
setupPosition( { object, camera, context } ) {
41+
setupPositionView( builder ) {
42+
43+
const { object, camera } = builder;
4244

4345
const sizeAttenuation = this.sizeAttenuation;
4446

4547
// < VERTEX STAGE >
4648

47-
const { positionNode, rotationNode, scaleNode } = this;
48-
49-
const vertex = positionLocal;
49+
const { rotationNode, scaleNode } = this;
5050

51-
let mvPosition = modelViewMatrix.mul( vec3( positionNode || 0 ) );
51+
const mvPosition = modelViewMatrix.mul( positionLocal );
5252

5353
let scale = vec2( modelWorldMatrix[ 0 ].xyz.length(), modelWorldMatrix[ 1 ].xyz.length() );
5454

@@ -74,7 +74,7 @@ class SpriteNodeMaterial extends NodeMaterial {
7474

7575
}
7676

77-
let alignedPosition = vertex.xy;
77+
let alignedPosition = positionGeometry.xy;
7878

7979
if ( object.center && object.center.isVector2 === true ) {
8080

@@ -90,13 +90,7 @@ class SpriteNodeMaterial extends NodeMaterial {
9090

9191
const rotatedPosition = rotate( alignedPosition, rotation );
9292

93-
mvPosition = vec4( mvPosition.xy.add( rotatedPosition ), mvPosition.zw );
94-
95-
const modelViewProjection = cameraProjectionMatrix.mul( mvPosition );
96-
97-
context.vertex = vertex;
98-
99-
return modelViewProjection;
93+
return vec4( mvPosition.xy.add( rotatedPosition ), mvPosition.zw );
10094

10195
}
10296

‎src/nodes/Nodes.js‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -67,7 +67,6 @@ export { default as MaterialReferenceNode } from './accessors/MaterialReferenceN
6767
export { default as RendererReferenceNode } from './accessors/RendererReferenceNode.js';
6868
export { default as MorphNode } from './accessors/MorphNode.js';
6969
export { default as ModelNode } from './accessors/ModelNode.js';
70-
export { default as ModelViewProjectionNode } from './accessors/ModelViewProjectionNode.js';
7170
export { default as Object3DNode } from './accessors/Object3DNode.js';
7271
export { default as PointUVNode } from './accessors/PointUVNode.js';
7372
export { default as ReferenceNode } from './accessors/ReferenceNode.js';

‎src/nodes/accessors/ModelNode.js‎

Lines changed: 16 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -39,9 +39,20 @@ export const modelScale = /*@__PURE__*/ nodeImmutable( ModelNode, ModelNode.SCAL
3939
export const modelViewPosition = /*@__PURE__*/ nodeImmutable( ModelNode, ModelNode.VIEW_POSITION );
4040
export const modelNormalMatrix = /*@__PURE__*/ uniform( new Matrix3() ).onObjectUpdate( ( { object }, self ) => self.value.getNormalMatrix( object.matrixWorld ) );
4141
export const modelWorldMatrixInverse = /*@__PURE__*/ uniform( new Matrix4() ).onObjectUpdate( ( { object }, self ) => self.value.copy( object.matrixWorld ).invert() );
42-
export const modelViewMatrix = /*@__PURE__*/ cameraViewMatrix.mul( modelWorldMatrix ).toVar( 'modelViewMatrix' );
4342

44-
export const highPrecisionModelViewMatrix = /*@__PURE__*/ ( Fn( ( builder ) => {
43+
export const modelViewMatrix = /*@__PURE__*/ ( Fn( ( builder ) => {
44+
45+
return builder.renderer.nodes.modelViewMatrix || mediumpModelViewMatrix;
46+
47+
} ).once() )().toVar( 'modelViewMatrix' );
48+
49+
// GPU Precision
50+
51+
export const mediumpModelViewMatrix = /*@__PURE__*/ cameraViewMatrix.mul( modelWorldMatrix );
52+
53+
// CPU Precision
54+
55+
export const highpModelViewMatrix = /*@__PURE__*/ ( Fn( ( builder ) => {
4556

4657
builder.context.isHighPrecisionModelViewMatrix = true;
4758

@@ -51,9 +62,9 @@ export const highPrecisionModelViewMatrix = /*@__PURE__*/ ( Fn( ( builder ) => {
5162

5263
} );
5364

54-
} ).once() )().toVar( 'highPrecisionModelViewMatrix' );
65+
} ).once() )().toVar( 'highpModelViewMatrix' );
5566

56-
export const highPrecisionModelNormalViewMatrix = /*@__PURE__*/ ( Fn( ( builder ) => {
67+
export const highpModelNormalViewMatrix = /*@__PURE__*/ ( Fn( ( builder ) => {
5768

5869
const isHighPrecisionModelViewMatrix = builder.context.isHighPrecisionModelViewMatrix;
5970

@@ -69,4 +80,4 @@ export const highPrecisionModelNormalViewMatrix = /*@__PURE__*/ ( Fn( ( builder
6980

7081
} );
7182

72-
} ).once() )().toVar( 'highPrecisionModelNormalMatrix' );
83+
} ).once() )().toVar( 'highpModelNormalViewMatrix' );

0 commit comments

Comments
 (0)