diff --git a/examples/jsm/renderers/common/Animation.js b/examples/jsm/renderers/common/Animation.js index 50da8c0591db22..6b2056a451a320 100644 --- a/examples/jsm/renderers/common/Animation.js +++ b/examples/jsm/renderers/common/Animation.js @@ -1,23 +1,17 @@ class Animation { - constructor() { + constructor( nodes ) { - this.nodes = null; + this.nodes = nodes; this.animationLoop = null; this.requestId = null; - this.isAnimating = false; - - this.context = self; + this._init(); } - start() { - - if ( this.isAnimating === true || this.animationLoop === null || this.nodes === null ) return; - - this.isAnimating = true; + _init() { const update = ( time, frame ) => { @@ -25,7 +19,7 @@ class Animation { this.nodes.nodeFrame.update(); - this.animationLoop( time, frame ); + if ( this.animationLoop !== null ) this.animationLoop( time, frame ); }; @@ -33,12 +27,10 @@ class Animation { } - stop() { + dispose() { self.cancelAnimationFrame( this.requestId ); - this.isAnimating = false; - } setAnimationLoop( callback ) { @@ -47,12 +39,6 @@ class Animation { } - setNodes( nodes ) { - - this.nodes = nodes; - - } - } export default Animation; diff --git a/examples/jsm/renderers/common/Bindings.js b/examples/jsm/renderers/common/Bindings.js index b78d110181d23a..d7610dc1298eeb 100644 --- a/examples/jsm/renderers/common/Bindings.js +++ b/examples/jsm/renderers/common/Bindings.js @@ -101,7 +101,7 @@ class Bindings extends DataMap { const { backend } = this; const updateMap = this.updateMap; - const frame = this.info.render.frame; + const callId = this.info.call; let needsBindingsUpdate = false; @@ -109,7 +109,7 @@ class Bindings extends DataMap { for ( const binding of bindings ) { - const isUpdated = updateMap.get( binding ) === frame; + const isUpdated = updateMap.get( binding ) === callId; if ( isUpdated ) continue; @@ -137,7 +137,7 @@ class Bindings extends DataMap { } - updateMap.set( binding, frame ); + updateMap.set( binding, callId ); } diff --git a/examples/jsm/renderers/common/Geometries.js b/examples/jsm/renderers/common/Geometries.js index 0de0b7e37d6366..1ba451f4a63721 100644 --- a/examples/jsm/renderers/common/Geometries.js +++ b/examples/jsm/renderers/common/Geometries.js @@ -76,7 +76,7 @@ class Geometries extends DataMap { this.info = info; this.wireframes = new WeakMap(); - this.attributeFrame = new WeakMap(); + this.attributeCall = new WeakMap(); } @@ -162,13 +162,13 @@ class Geometries extends DataMap { updateAttribute( attribute, type ) { - const frame = this.info.render.frame; + const callId = this.info.render.call; - if ( this.attributeFrame.get( attribute ) !== frame ) { + if ( this.attributeCall.get( attribute ) !== callId ) { this.attributes.update( attribute, type ); - this.attributeFrame.set( attribute, frame ); + this.attributeCall.set( attribute, callId ); } diff --git a/examples/jsm/renderers/common/Info.js b/examples/jsm/renderers/common/Info.js index 77d773e7a03ab4..ecb66caf75b5b6 100644 --- a/examples/jsm/renderers/common/Info.js +++ b/examples/jsm/renderers/common/Info.js @@ -4,14 +4,20 @@ class Info { this.autoReset = true; + this.call = 0; + this.render = { - frame: 0, + call: 0, drawCalls: 0, triangles: 0, points: 0, lines: 0 }; + this.compute = { + call: 0 + }; + this.memory = { geometries: 0, textures: 0 @@ -60,7 +66,10 @@ class Info { this.reset(); - this.render.frame = 0; + this.call = 0; + + this.render.call = 0; + this.compute.call = 0; this.memory.geometries = 0; this.memory.textures = 0; diff --git a/examples/jsm/renderers/common/Renderer.js b/examples/jsm/renderers/common/Renderer.js index ab4d9ddac81855..ae6a9be0fad494 100644 --- a/examples/jsm/renderers/common/Renderer.js +++ b/examples/jsm/renderers/common/Renderer.js @@ -62,6 +62,7 @@ class Renderer { this._attributes = null; this._geometries = null; this._nodes = null; + this._animation = null; this._bindings = null; this._objects = null; this._pipelines = null; @@ -70,8 +71,6 @@ class Renderer { this._textures = null; this._background = null; - this._animation = new Animation(); - this._currentRenderContext = null; this._lastRenderContext = null; @@ -136,6 +135,7 @@ class Renderer { } this._nodes = new Nodes( this, backend ); + this._animation = new Animation( this._nodes ); this._attributes = new Attributes( backend ); this._background = new Background( this, this._nodes ); this._geometries = new Geometries( this._attributes, this.info ); @@ -148,9 +148,6 @@ class Renderer { // - this._animation.setNodes( this._nodes ); - this._animation.start(); - this._initialized = true; resolve(); @@ -197,8 +194,14 @@ class Renderer { this._currentRenderContext = renderContext; this._currentRenderObjectFunction = this._renderObjectFunction || this.renderObject; + // + nodeFrame.renderId ++; + this.info.call ++; + + this.info.render.call ++; + // const coordinateSystem = this.coordinateSystem; @@ -213,16 +216,12 @@ class Renderer { // - if ( this._animation.isAnimating === false ) nodeFrame.update(); - if ( scene.matrixWorldAutoUpdate === true ) scene.updateMatrixWorld(); if ( camera.parent === null && camera.matrixWorldAutoUpdate === true ) camera.updateMatrixWorld(); if ( this.info.autoReset === true ) this.info.reset(); - this.info.render.frame ++; - // let viewport = this._viewport; @@ -361,15 +360,11 @@ class Renderer { } - setAnimationLoop( callback ) { - - if ( this._initialized === false ) this.init(); + async setAnimationLoop( callback ) { - const animation = this._animation; - - animation.setAnimationLoop( callback ); + if ( this._initialized === false ) await this.init(); - ( callback === null ) ? animation.stop() : animation.start(); + this._animation.setAnimationLoop( callback ); } @@ -621,6 +616,7 @@ class Renderer { this.info.dispose(); + this._animation.dispose(); this._objects.dispose(); this._properties.dispose(); this._pipelines.dispose(); @@ -665,12 +661,26 @@ class Renderer { if ( this._initialized === false ) await this.init(); + // + + this.info.call ++; + + this.info.compute.call ++; + + // + const backend = this.backend; const pipelines = this._pipelines; const bindings = this._bindings; const nodes = this._nodes; const computeList = Array.isArray( computeNodes ) ? computeNodes : [ computeNodes ]; + if ( computeList[ 0 ] === undefined || computeList[ 0 ].isComputeNode !== true ) { + + throw new Error( 'THREE.Renderer: .compute() expects a ComputeNode.' ); + + } + backend.beginCompute( computeNodes ); for ( const computeNode of computeList ) { diff --git a/examples/jsm/renderers/common/nodes/Nodes.js b/examples/jsm/renderers/common/nodes/Nodes.js index 13543fd66d97c8..c22fa49ac4f5e6 100644 --- a/examples/jsm/renderers/common/nodes/Nodes.js +++ b/examples/jsm/renderers/common/nodes/Nodes.js @@ -14,7 +14,7 @@ class Nodes extends DataMap { this.backend = backend; this.nodeFrame = new NodeFrame(); this.nodeBuilderCache = new Map(); - this.frameHashCache = new ChainMap(); + this.callHashCache = new ChainMap(); } @@ -148,11 +148,11 @@ class Nodes extends DataMap { getCacheKey( scene, lightsNode ) { const chain = [ scene, lightsNode ]; - const frameId = this.nodeFrame.frameId; + const callId = this.renderer.info.call; - let cacheKeyData = this.frameHashCache.get( chain ); + let cacheKeyData = this.callHashCache.get( chain ); - if ( cacheKeyData === undefined || cacheKeyData.frameId !== frameId ) { + if ( cacheKeyData === undefined || cacheKeyData.callId !== callId ) { const environmentNode = this.getEnvironmentNode( scene ); const fogNode = this.getFogNode( scene ); @@ -166,11 +166,11 @@ class Nodes extends DataMap { if ( toneMappingNode ) cacheKey.push( toneMappingNode.getCacheKey() ); cacheKeyData = { - frameId, + callId, cacheKey: cacheKey.join( ',' ) }; - this.frameHashCache.set( chain, cacheKeyData ); + this.callHashCache.set( chain, cacheKeyData ); }