diff --git a/examples-jsm/changes.patch b/examples-jsm/changes.patch
index 656a6f741..bbc97a4df 100644
--- a/examples-jsm/changes.patch
+++ b/examples-jsm/changes.patch
@@ -1,8 +1,8 @@
 diff --git a/examples-jsm/examples/nodes/core/Node.ts b/examples-jsm/examples/nodes/core/Node.ts
-index 438c44dd..22392dfd 100644
+index 438c44dd..ec4f8b35 100644
 --- a/examples-jsm/examples/nodes/core/Node.ts
 +++ b/examples-jsm/examples/nodes/core/Node.ts
-@@ -2,12 +2,94 @@ import { EventDispatcher } from 'three';
+@@ -2,13 +2,95 @@ import { EventDispatcher } from 'three';
  import { NodeUpdateType } from './constants.js';
  import { getNodeChildren, getCacheKey } from './NodeUtils.js';
  import { MathUtils } from 'three';
@@ -15,6 +15,7 @@ index 438c44dd..22392dfd 100644
  let _nodeId = 0;
  
 -class Node extends EventDispatcher {
+-    constructor(nodeType = null) {
 +interface NodeConstructor {
 +    type?: string;
 +}
@@ -96,9 +97,10 @@ index 438c44dd..22392dfd 100644
 +
 +    self?: this;
 +
-     constructor(nodeType = null) {
++    constructor(nodeType: string | null = null) {
          super();
  
+         this.nodeType = nodeType;
 @@ -28,36 +110,36 @@ class Node extends EventDispatcher {
          Object.defineProperty(this, 'id', { value: _nodeId++ });
      }
@@ -463,7 +465,7 @@ index 190fe8c5..d873bb24 100644
  
          this.name = name;
 diff --git a/examples-jsm/examples/nodes/core/NodeBuilder.ts b/examples-jsm/examples/nodes/core/NodeBuilder.ts
-index ebdc13ff..a077bb0c 100644
+index ebdc13ff..065940d7 100644
 --- a/examples-jsm/examples/nodes/core/NodeBuilder.ts
 +++ b/examples-jsm/examples/nodes/core/NodeBuilder.ts
 @@ -8,7 +8,7 @@ import NodeCache from './NodeCache.js';
@@ -488,7 +490,7 @@ index ebdc13ff..a077bb0c 100644
  } from 'three';
  
  import { stack } from './StackNode.js';
-@@ -39,6 +45,12 @@ import CubeRenderTarget from '../../renderers/common/CubeRenderTarget.js';
+@@ -39,6 +45,15 @@ import CubeRenderTarget from '../../renderers/common/CubeRenderTarget.js';
  import ChainMap from '../../renderers/common/ChainMap.js';
  
  import PMREMGenerator from '../../renderers/common/extras/PMREMGenerator.js';
@@ -498,10 +500,13 @@ index ebdc13ff..a077bb0c 100644
 +import LightsNode from '../lighting/LightsNode.js';
 +import EnvironmentNode from '../lighting/EnvironmentNode.js';
 +import FogNode from '../fog/FogNode.js';
++import ClippingContext from '../../renderers/common/ClippingContext.js';
++import Binding from '../../renderers/common/Binding.js';
++import NodeUniformsGroup from '../../renderers/common/nodes/NodeUniformsGroup.js';
  
  const uniformsGroupCache = new ChainMap();
  
-@@ -67,10 +79,75 @@ const toFloat = value => {
+@@ -67,10 +82,72 @@ const toFloat = value => {
  };
  
  class NodeBuilder {
@@ -522,8 +527,7 @@ index ebdc13ff..a077bb0c 100644
 +    environmentNode: EnvironmentNode | null;
 +    fogNode: FogNode | null;
 +
-+    // TODO
-+    // clippingContext
++    clippingContext: ClippingContext | null;
 +
 +    vertexShader: string | null;
 +    fragmentShader: string | null;
@@ -534,12 +538,10 @@ index ebdc13ff..a077bb0c 100644
 +    // flowCode
 +    uniforms: { vertex: NodeUniform[]; fragment: NodeUniform[]; compute: NodeUniform[]; index: number };
 +    structs: { vertex: Node[]; fragment: Node[]; compute: Node[]; index: number };
-+    // TODO
-+    // bindings
++    bindings: { vertex: Binding[]; fragment: Binding[]; compute: Binding[] };
 +    bindingsOffset: { vertex: number; fragment: number; compute: number };
-+    // TODO
-+    // bindingsArray
-+    // attributes
++    bindingsArray: Binding[];
++    attributes: NodeAttribute[];
 +    bufferAttributes: NodeAttribute[];
 +    varyings: NodeVarying[];
 +    codes: { vertex?: NodeCode[] | undefined; fragment?: NodeCode[] | undefined; compute?: NodeCode[] | undefined };
@@ -589,7 +591,7 @@ index ebdc13ff..a077bb0c 100644
          return new RenderTarget(width, height, options);
      }
  
-@@ -138,7 +215,7 @@ class NodeBuilder {
+@@ -138,17 +215,17 @@ class NodeBuilder {
          return new PMREMGenerator(this.renderer);
      }
  
@@ -598,6 +600,19 @@ index ebdc13ff..a077bb0c 100644
          return this.nodes.includes(node);
      }
  
+-    _getSharedBindings(bindings) {
++    _getSharedBindings(bindings: Binding[]) {
+         const shared = [];
+ 
+         for (const binding of bindings) {
+-            if (binding.shared === true) {
++            if ((binding as NodeUniformsGroup).shared === true) {
+                 // nodes is the chainmap key
+-                const nodes = binding.getNodes();
++                const nodes = (binding as NodeUniformsGroup).getNodes();
+ 
+                 let sharedBinding = uniformsGroupCache.get(nodes);
+ 
 @@ -181,11 +258,11 @@ class NodeBuilder {
          return bindingsArray;
      }
@@ -900,12 +915,14 @@ index 96a7e0c7..b1a61b35 100644
      }
  }
 diff --git a/examples-jsm/examples/nodes/core/NodeFrame.ts b/examples-jsm/examples/nodes/core/NodeFrame.ts
-index b8e8d37b..399c788b 100644
+index b8e8d37b..d5c60178 100644
 --- a/examples-jsm/examples/nodes/core/NodeFrame.ts
 +++ b/examples-jsm/examples/nodes/core/NodeFrame.ts
-@@ -1,6 +1,16 @@
+@@ -1,6 +1,26 @@
  import { NodeUpdateType } from './constants.js';
 +import Node from './Node.js';
++import Renderer from '../../renderers/common/Renderer.js';
++import { Camera, Material, Object3D, Scene } from 'three';
  
  class NodeFrame {
 +    time: number;
@@ -914,13 +931,21 @@ index b8e8d37b..399c788b 100644
 +    frameId: number;
 +    renderId: number;
 +
-+    // TODO
-+    // startTime
++    // TODO startTime
++
++    // TODO updateMap
++    // TODO updateBeforeMap
++
++    renderer: Renderer | null;
++    material: Material | null;
++    camera: Camera | null;
++    object: Object3D | null;
++    scene: Scene | null;
 +
      constructor() {
          this.time = 0;
          this.deltaTime = 0;
-@@ -35,7 +45,7 @@ class NodeFrame {
+@@ -35,7 +55,7 @@ class NodeFrame {
          return maps;
      }
  
@@ -929,7 +954,7 @@ index b8e8d37b..399c788b 100644
          const updateType = node.getUpdateBeforeType();
          const reference = node.updateReference(this);
  
-@@ -60,7 +70,7 @@ class NodeFrame {
+@@ -60,7 +80,7 @@ class NodeFrame {
          }
      }
  
@@ -1134,6 +1159,33 @@ index a1482362..0a62b23d 100644
          super(name, type);
  
          this.needsInterpolation = false;
+diff --git a/examples-jsm/examples/nodes/core/UniformGroupNode.ts b/examples-jsm/examples/nodes/core/UniformGroupNode.ts
+index f8bb2b37..cee70486 100644
+--- a/examples-jsm/examples/nodes/core/UniformGroupNode.ts
++++ b/examples-jsm/examples/nodes/core/UniformGroupNode.ts
+@@ -2,6 +2,13 @@ import Node from './Node.js';
+ import { addNodeClass } from './Node.js';
+ 
+ class UniformGroupNode extends Node {
++    // TODO name
++    version: number;
++
++    shared: boolean;
++
++    isUniformGroup: boolean;
++
+     constructor(name, shared = false) {
+         super('string');
+ 
+@@ -13,7 +20,7 @@ class UniformGroupNode extends Node {
+         this.isUniformGroup = true;
+     }
+ 
+-    set needsUpdate(value) {
++    set needsUpdate(value: boolean) {
+         if (value === true) this.version++;
+     }
+ }
 diff --git a/examples-jsm/examples/nodes/core/constants.ts b/examples-jsm/examples/nodes/core/constants.ts
 index 3b01a9a6..5ff6ad5f 100644
 --- a/examples-jsm/examples/nodes/core/constants.ts
@@ -1283,21 +1335,32 @@ index ed9e8e9e..f0f75022 100644
  
          this.backend = backend;
 diff --git a/examples-jsm/examples/renderers/common/Backend.ts b/examples-jsm/examples/renderers/common/Backend.ts
-index e48a8029..0084dc83 100644
+index e48a8029..7b683c48 100644
 --- a/examples-jsm/examples/renderers/common/Backend.ts
 +++ b/examples-jsm/examples/renderers/common/Backend.ts
-@@ -1,22 +1,57 @@
+@@ -1,22 +1,68 @@
 -let vector2 = null;
 -let vector4 = null;
 -let color4 = null;
 -
  import Color4 from './Color4.js';
 -import { Vector2, Vector4, REVISION, createCanvasElement } from 'three';
-+import { Vector2, Vector4, REVISION, createCanvasElement, CoordinateSystem, BufferAttribute } from 'three';
++import {
++    Vector2,
++    Vector4,
++    REVISION,
++    createCanvasElement,
++    CoordinateSystem,
++    BufferAttribute,
++    Object3D,
++    Scene,
++} from 'three';
 +import Renderer from './Renderer.js';
 +import RenderContext from './RenderContext.js';
 +import RenderBundle from './RenderBundle.js';
 +import RenderObject from './RenderObject.js';
++import NodeBuilder from '../../nodes/core/NodeBuilder.js';
++import ComputeNode from '../../nodes/gpgpu/ComputeNode.js';
 +
 +let vector2: Vector2 | null = null;
 +let vector4: Vector4 | null = null;
@@ -1353,7 +1416,20 @@ index e48a8029..0084dc83 100644
      // render context
  
      begin(renderContext) {}
-@@ -144,7 +179,10 @@ class Backend {
+@@ -55,7 +101,11 @@ class Backend {
+ 
+     // node builder
+ 
+-    createNodeBuilder(renderObject) {} // return NodeBuilder (ADD IT)
++    abstract createNodeBuilder(
++        renderObject: Object3D | ComputeNode,
++        renderer: Renderer,
++        scene?: Scene | null,
++    ): NodeBuilder; // return NodeBuilder (ADD IT)
+ 
+     // textures
+ 
+@@ -144,7 +194,10 @@ class Backend {
          this.data.set(object, value);
      }
  
@@ -1365,7 +1441,7 @@ index e48a8029..0084dc83 100644
          let map = this.data.get(object);
  
          if (map === undefined) {
-@@ -155,11 +193,11 @@ class Backend {
+@@ -155,11 +208,11 @@ class Backend {
          return map;
      }
  
@@ -1427,22 +1503,60 @@ index b7902dd4..38e1f624 100644
          const renderer = this.renderer;
          const background = this.nodes.getBackgroundNode(scene) || scene.background;
  
+diff --git a/examples-jsm/examples/renderers/common/Binding.ts b/examples-jsm/examples/renderers/common/Binding.ts
+index a12f3563..e7ae8d1c 100644
+--- a/examples-jsm/examples/renderers/common/Binding.ts
++++ b/examples-jsm/examples/renderers/common/Binding.ts
+@@ -1,16 +1,20 @@
+ class Binding {
++    name: string;
++
++    visibility: number;
++
+     constructor(name = '') {
+         this.name = name;
+ 
+         this.visibility = 0;
+     }
+ 
+-    setVisibility(visibility) {
++    setVisibility(visibility: number) {
+         this.visibility |= visibility;
+     }
+ 
+     clone() {
+-        return Object.assign(new this.constructor(), this);
++        return Object.assign(new (this.constructor as typeof Binding)(), this);
+     }
+ }
+ 
 diff --git a/examples-jsm/examples/renderers/common/Bindings.ts b/examples-jsm/examples/renderers/common/Bindings.ts
-index 9485ec3b..6a39a1db 100644
+index 9485ec3b..2e6ff73b 100644
 --- a/examples-jsm/examples/renderers/common/Bindings.ts
 +++ b/examples-jsm/examples/renderers/common/Bindings.ts
-@@ -1,8 +1,28 @@
+@@ -1,8 +1,37 @@
  import DataMap from './DataMap.js';
  import { AttributeType } from './Constants.js';
+-
+-class Bindings extends DataMap {
+-    constructor(backend, nodes, textures, attributes, pipelines, info) {
 +import Backend from './Backend.js';
 +import Nodes from './nodes/Nodes.js';
 +import Textures from './Textures.js';
 +import Attributes from './Attributes.js';
 +import Pipelines from './Pipelines.js';
 +import Info from './Info.js';
- 
- class Bindings extends DataMap {
--    constructor(backend, nodes, textures, attributes, pipelines, info) {
++import RenderObject from './RenderObject.js';
++import ComputeNode from '../../nodes/gpgpu/ComputeNode.js';
++
++interface RenderObjectData {}
++
++interface ComputeNodeData {}
++
++class Bindings extends DataMap<{
++    renderObject: { key: RenderObject; value: RenderObjectData };
++    computeNode: { key: RenderObject; value: ComputeNodeData };
++}> {
 +    backend: Backend;
 +    textures: Textures;
 +    pipelines: Pipelines;
@@ -1461,6 +1575,55 @@ index 9485ec3b..6a39a1db 100644
          super();
  
          this.backend = backend;
+@@ -15,7 +44,7 @@ class Bindings extends DataMap {
+         this.pipelines.bindings = this; // assign bindings to pipelines
+     }
+ 
+-    getForRender(renderObject) {
++    getForRender(renderObject: RenderObject) {
+         const bindings = renderObject.getBindings();
+ 
+         const data = this.get(renderObject);
+@@ -33,7 +62,7 @@ class Bindings extends DataMap {
+         return data.bindings;
+     }
+ 
+-    getForCompute(computeNode) {
++    getForCompute(computeNode: ComputeNode) {
+         const data = this.get(computeNode);
+ 
+         if (data.bindings === undefined) {
+@@ -51,11 +80,11 @@ class Bindings extends DataMap {
+         return data.bindings;
+     }
+ 
+-    updateForCompute(computeNode) {
++    updateForCompute(computeNode: ComputeNode) {
+         this._update(computeNode, this.getForCompute(computeNode));
+     }
+ 
+-    updateForRender(renderObject) {
++    updateForRender(renderObject: RenderObject) {
+         this._update(renderObject, this.getForRender(renderObject));
+     }
+ 
+diff --git a/examples-jsm/examples/renderers/common/Buffer.ts b/examples-jsm/examples/renderers/common/Buffer.ts
+index 17013c6d..56064725 100644
+--- a/examples-jsm/examples/renderers/common/Buffer.ts
++++ b/examples-jsm/examples/renderers/common/Buffer.ts
+@@ -2,7 +2,11 @@ import Binding from './Binding.js';
+ import { getFloatLength } from './BufferUtils.js';
+ 
+ class Buffer extends Binding {
+-    constructor(name, buffer = null) {
++    readonly isBuffer: true;
++
++    bytesPerElement: number;
++
++    constructor(name?: string, buffer = null) {
+         super(name);
+ 
+         this.isBuffer = true;
 diff --git a/examples-jsm/examples/renderers/common/ChainMap.ts b/examples-jsm/examples/renderers/common/ChainMap.ts
 index e233beca..c4e8a2e9 100644
 --- a/examples-jsm/examples/renderers/common/ChainMap.ts
@@ -2188,10 +2351,10 @@ index 3fc3134e..0cc369e5 100644
  }
  
 diff --git a/examples-jsm/examples/renderers/common/RenderObject.ts b/examples-jsm/examples/renderers/common/RenderObject.ts
-index 861c15dc..ce14e59c 100644
+index 861c15dc..3d9b27b7 100644
 --- a/examples-jsm/examples/renderers/common/RenderObject.ts
 +++ b/examples-jsm/examples/renderers/common/RenderObject.ts
-@@ -1,4 +1,10 @@
+@@ -1,4 +1,11 @@
  import ClippingContext from './ClippingContext.js';
 +import Nodes from './nodes/Nodes.js';
 +import Geometries from './Geometries.js';
@@ -2199,10 +2362,11 @@ index 861c15dc..ce14e59c 100644
 +import { Camera, Material, Object3D, Scene } from 'three';
 +import LightsNode from '../../nodes/lighting/LightsNode.js';
 +import RenderContext from './RenderContext.js';
++import NodeBuilderState from './nodes/NodeBuilderState.js';
  
  let id = 0;
  
-@@ -27,7 +33,60 @@ function getKeys(obj) {
+@@ -27,7 +34,60 @@ function getKeys(obj) {
  }
  
  export default class RenderObject {
@@ -2232,7 +2396,7 @@ index 861c15dc..ce14e59c 100644
 +    // pipeline
 +    // vertexBuffers
 +
-+    clippingContext?: ClippingContext | undefined;
++    clippingContext!: ClippingContext;
 +
 +    clippingContextVersion: number;
 +
@@ -2240,8 +2404,8 @@ index 861c15dc..ce14e59c 100644
 +    // initialNodesCacheKey
 +    initialCacheKey: string;
 +
++    _nodeBuilderState: NodeBuilderState | null;
 +    // TODO
-+    // this._nodeBuilderState = null;
 +    // this._bindings = null;
 +
 +    onDispose: (() => void) | null;
@@ -2264,19 +2428,16 @@ index 861c15dc..ce14e59c 100644
          this._nodes = nodes;
          this._geometries = geometries;
  
-@@ -50,9 +109,9 @@ export default class RenderObject {
+@@ -50,7 +110,7 @@ export default class RenderObject {
          this.pipeline = null;
          this.vertexBuffers = null;
  
 -        this.updateClipping(renderContext.clippingContext);
 +        this.updateClipping(renderContext.clippingContext!);
  
--        this.clippingContextVersion = this.clippingContext.version;
-+        this.clippingContextVersion = this.clippingContext!.version;
+         this.clippingContextVersion = this.clippingContext.version;
  
-         this.initialNodesCacheKey = this.getNodesCacheKey();
-         this.initialCacheKey = this.getCacheKey();
-@@ -71,7 +130,7 @@ export default class RenderObject {
+@@ -71,7 +131,7 @@ export default class RenderObject {
          this.material.addEventListener('dispose', this.onMaterialDispose);
      }
  
@@ -2285,7 +2446,7 @@ index 861c15dc..ce14e59c 100644
          const material = this.material;
  
          let clippingContext = this.clippingContext;
-@@ -89,9 +148,9 @@ export default class RenderObject {
+@@ -89,9 +149,9 @@ export default class RenderObject {
      }
  
      get clippingNeedsUpdate() {
@@ -2297,7 +2458,7 @@ index 861c15dc..ce14e59c 100644
  
          return true;
      }
-@@ -109,7 +168,7 @@ export default class RenderObject {
+@@ -109,7 +169,7 @@ export default class RenderObject {
      }
  
      getChainArray() {
@@ -2306,7 +2467,7 @@ index 861c15dc..ce14e59c 100644
      }
  
      getAttributes() {
-@@ -206,6 +265,6 @@ export default class RenderObject {
+@@ -206,6 +266,6 @@ export default class RenderObject {
      dispose() {
          this.material.removeEventListener('dispose', this.onMaterialDispose);
  
@@ -2425,7 +2586,7 @@ index 76dc482e..27997a90 100644
          const chainMap = this.getChainMap(passId);
  
 diff --git a/examples-jsm/examples/renderers/common/Renderer.ts b/examples-jsm/examples/renderers/common/Renderer.ts
-index acf180d8..ef90cb7e 100644
+index acf180d8..3e7e9dfd 100644
 --- a/examples-jsm/examples/renderers/common/Renderer.ts
 +++ b/examples-jsm/examples/renderers/common/Renderer.ts
 @@ -30,10 +30,40 @@ import {
@@ -2830,7 +2991,7 @@ index acf180d8..ef90cb7e 100644
              this.setRenderTarget(outputRenderTarget, activeCubeFace, activeMipmapLevel);
  
 -            _quad.material.fragmentNode = this._nodes.getOutputNode(renderTarget.texture);
-+            _quad.material.fragmentNode = this._nodes!.getOutputNode(renderTarget.texture);
++            _quad.material.fragmentNode = this._nodes!.getOutputNode(renderTarget!.texture);
  
              this._renderScene(_quad, _quad.camera, false);
          }
@@ -3583,58 +3744,276 @@ index 0eb0509c..6eb18198 100644
          this.backend.destroySampler(texture);
          this.backend.destroyTexture(texture);
  
+diff --git a/examples-jsm/examples/renderers/common/UniformBuffer.ts b/examples-jsm/examples/renderers/common/UniformBuffer.ts
+index 28aac0d7..2479d00d 100644
+--- a/examples-jsm/examples/renderers/common/UniformBuffer.ts
++++ b/examples-jsm/examples/renderers/common/UniformBuffer.ts
+@@ -1,7 +1,9 @@
+ import Buffer from './Buffer.js';
+ 
+ class UniformBuffer extends Buffer {
+-    constructor(name, buffer = null) {
++    readonly isUniformBuffer: true;
++
++    constructor(name?: string, buffer = null) {
+         super(name, buffer);
+ 
+         this.isUniformBuffer = true;
+diff --git a/examples-jsm/examples/renderers/common/UniformsGroup.ts b/examples-jsm/examples/renderers/common/UniformsGroup.ts
+index beb35347..b51cf541 100644
+--- a/examples-jsm/examples/renderers/common/UniformsGroup.ts
++++ b/examples-jsm/examples/renderers/common/UniformsGroup.ts
+@@ -2,7 +2,9 @@ import UniformBuffer from './UniformBuffer.js';
+ import { GPU_CHUNK_BYTES } from './Constants.js';
+ 
+ class UniformsGroup extends UniformBuffer {
+-    constructor(name) {
++    readonly isUniformsGroup: true;
++
++    constructor(name?: string) {
+         super(name);
+ 
+         this.isUniformsGroup = true;
+diff --git a/examples-jsm/examples/renderers/common/nodes/NodeBuilderState.ts b/examples-jsm/examples/renderers/common/nodes/NodeBuilderState.ts
+index 5553bd2d..4c4a4cde 100644
+--- a/examples-jsm/examples/renderers/common/nodes/NodeBuilderState.ts
++++ b/examples-jsm/examples/renderers/common/nodes/NodeBuilderState.ts
+@@ -1,12 +1,29 @@
++import Node from '../../../nodes/core/Node.js';
++import NodeAttribute from '../../../nodes/core/NodeAttribute.js';
++import Binding from '../Binding.js';
++
+ class NodeBuilderState {
++    vertexShader: string | null;
++    fragmentShader: string | null;
++    computeShader: string | null;
++    // TODO transforms
++
++    nodeAttributes: NodeAttribute[];
++    bindings: Binding[];
++
++    updateNodes: Node[];
++    updateBeforeNodes: Node[];
++
++    usedTimes: number;
++
+     constructor(
+-        vertexShader,
+-        fragmentShader,
+-        computeShader,
+-        nodeAttributes,
+-        bindings,
+-        updateNodes,
+-        updateBeforeNodes,
++        vertexShader: string | null,
++        fragmentShader: string | null,
++        computeShader: string | null,
++        nodeAttributes: NodeAttribute[],
++        bindings: Binding[],
++        updateNodes: Node[],
++        updateBeforeNodes: Node[],
+         transforms = [],
+     ) {
+         this.vertexShader = vertexShader;
+diff --git a/examples-jsm/examples/renderers/common/nodes/NodeUniformsGroup.ts b/examples-jsm/examples/renderers/common/nodes/NodeUniformsGroup.ts
+index 0bbc1add..783d8db1 100644
+--- a/examples-jsm/examples/renderers/common/nodes/NodeUniformsGroup.ts
++++ b/examples-jsm/examples/renderers/common/nodes/NodeUniformsGroup.ts
+@@ -1,9 +1,15 @@
+ import UniformsGroup from '../UniformsGroup.js';
++import UniformGroupNode from '../../../nodes/core/UniformGroupNode.js';
+ 
+ let id = 0;
+ 
+ class NodeUniformsGroup extends UniformsGroup {
+-    constructor(name, groupNode) {
++    id: number;
++    groupNode: UniformGroupNode;
++
++    readonly isNodeUniformsGroup: true;
++
++    constructor(name: string, groupNode: UniformGroupNode) {
+         super(name);
+ 
+         this.id = id++;
 diff --git a/examples-jsm/examples/renderers/common/nodes/Nodes.ts b/examples-jsm/examples/renderers/common/nodes/Nodes.ts
-index 86df5654..b0389629 100644
+index 86df5654..f8f1f74f 100644
 --- a/examples-jsm/examples/renderers/common/nodes/Nodes.ts
 +++ b/examples-jsm/examples/renderers/common/nodes/Nodes.ts
-@@ -2,10 +2,16 @@ import DataMap from '../DataMap.js';
+@@ -2,10 +2,20 @@ import DataMap from '../DataMap.js';
  import ChainMap from '../ChainMap.js';
  import NodeBuilderState from './NodeBuilderState.js';
  import {
++    Camera,
 +    Color,
 +    CubeTexture,
      EquirectangularReflectionMapping,
      EquirectangularRefractionMapping,
 +    Fog,
++    FogBase,
 +    FogExp2,
++    Material,
      NoToneMapping,
++    Object3D,
 +    Scene,
      SRGBColorSpace,
 +    Texture,
  } from 'three';
  import {
      NodeFrame,
-@@ -23,9 +29,19 @@ import {
+@@ -23,20 +33,63 @@ import {
      pmremTexture,
      viewportTopLeft,
  } from '../../../nodes/Nodes.js';
 +import Renderer from '../Renderer.js';
 +import Backend from '../Backend.js';
 +import LightsNode from '../../../nodes/lighting/LightsNode.js';
++import RenderObject from '../RenderObject.js';
++import NodeUniformsGroup from './NodeUniformsGroup.js';
++import NodeBuilder from '../../../nodes/core/NodeBuilder.js';
++import ComputeNode from '../../../nodes/gpgpu/ComputeNode.js';
++import Node from '../../../nodes/core/Node.js';
++import UniformGroupNode from '../../../nodes/core/UniformGroupNode.js';
++
++interface NodeUniformsGroupData {
++    renderId?: number | undefined;
++    frameId?: number | undefined;
++}
++
++interface RenderObjectData {
++    nodeBuilderState?: NodeBuilderState | undefined;
++}
++
++interface ComputeNodeData {
++    nodeBuilderState?: NodeBuilderState | undefined;
++}
++
++interface SceneData {
++    background?: Color | Texture | CubeTexture | undefined;
++    backgroundNode?: Node | undefined;
++    fog?: FogBase | undefined;
++    fogNode?: Node | undefined;
++    environment?: Texture | undefined;
++    environmentNode?: Node | undefined;
++}
  
- class Nodes extends DataMap {
+-class Nodes extends DataMap {
 -    constructor(renderer, backend) {
++class Nodes extends DataMap<{
++    nodeUniformsGroup: { key: NodeUniformsGroup; value: NodeUniformsGroupData };
++    renderObject: { key: RenderObject; value: RenderObjectData };
++    computeNode: { key: ComputeNode; value: ComputeNodeData };
++    scene: { key: Scene; value: SceneData };
++}> {
 +    renderer: Renderer;
 +    backend: Backend;
 +    nodeFrame: NodeFrame;
 +    nodeBuilderCache: Map<string, NodeBuilderState>;
-+    callHashCache: ChainMap;
-+    groupsData: ChainMap;
++    callHashCache: ChainMap<readonly [Scene, LightsNode], { callId: number; cacheKey: string }>;
++    groupsData: ChainMap<readonly [UniformGroupNode, NodeUniformsGroup], { version?: number }>;
 +
 +    constructor(renderer: Renderer, backend: Backend) {
          super();
  
          this.renderer = renderer;
-@@ -188,7 +204,7 @@ class Nodes extends DataMap {
+         this.backend = backend;
+         this.nodeFrame = new NodeFrame();
+         this.nodeBuilderCache = new Map();
+-        this.callHashCache = new ChainMap();
++        this.callHashCache = new ChainMap<readonly [Scene, LightsNode], { callId: number; cacheKey: string }>();
+         this.groupsData = new ChainMap();
+     }
+ 
+-    updateGroup(nodeUniformsGroup) {
++    updateGroup(nodeUniformsGroup: NodeUniformsGroup) {
+         const groupNode = nodeUniformsGroup.groupNode;
+         const name = groupNode.name;
+ 
+@@ -76,7 +129,7 @@ class Nodes extends DataMap {
+ 
+         // other groups are updated just when groupNode.needsUpdate is true
+ 
+-        const groupChain = [groupNode, nodeUniformsGroup];
++        const groupChain = [groupNode, nodeUniformsGroup] as const;
+ 
+         let groupData = this.groupsData.get(groupChain);
+         if (groupData === undefined) this.groupsData.set(groupChain, (groupData = {}));
+@@ -90,11 +143,11 @@ class Nodes extends DataMap {
+         return false;
+     }
+ 
+-    getForRenderCacheKey(renderObject) {
++    getForRenderCacheKey(renderObject: RenderObject) {
+         return renderObject.initialCacheKey;
+     }
+ 
+-    getForRender(renderObject) {
++    getForRender(renderObject: RenderObject) {
+         const renderObjectData = this.get(renderObject);
+ 
+         let nodeBuilderState = renderObjectData.nodeBuilderState;
+@@ -133,20 +186,20 @@ class Nodes extends DataMap {
+         return nodeBuilderState;
+     }
+ 
+-    delete(object) {
+-        if (object.isRenderObject) {
+-            const nodeBuilderState = this.get(object).nodeBuilderState;
++    delete(object: NodeUniformsGroup | RenderObject | ComputeNode | Scene) {
++        if ((object as RenderObject).isRenderObject) {
++            const nodeBuilderState = this.get(object as RenderObject).nodeBuilderState!;
+             nodeBuilderState.usedTimes--;
+ 
+             if (nodeBuilderState.usedTimes === 0) {
+-                this.nodeBuilderCache.delete(this.getForRenderCacheKey(object));
++                this.nodeBuilderCache.delete(this.getForRenderCacheKey(object as RenderObject));
+             }
+         }
+ 
+         return super.delete(object);
+     }
+ 
+-    getForCompute(computeNode) {
++    getForCompute(computeNode: ComputeNode) {
+         const computeData = this.get(computeNode);
+ 
+         let nodeBuilderState = computeData.nodeBuilderState;
+@@ -163,7 +216,7 @@ class Nodes extends DataMap {
+         return nodeBuilderState;
+     }
+ 
+-    _createNodeBuilderState(nodeBuilder) {
++    _createNodeBuilderState(nodeBuilder: NodeBuilder) {
+         return new NodeBuilderState(
+             nodeBuilder.vertexShader,
+             nodeBuilder.fragmentShader,
+@@ -176,20 +229,20 @@ class Nodes extends DataMap {
+         );
+     }
+ 
+-    getEnvironmentNode(scene) {
++    getEnvironmentNode(scene: Scene) {
+         return scene.environmentNode || this.get(scene).environmentNode || null;
+     }
+ 
+-    getBackgroundNode(scene) {
++    getBackgroundNode(scene: Scene) {
+         return scene.backgroundNode || this.get(scene).backgroundNode || null;
+     }
+ 
+-    getFogNode(scene) {
++    getFogNode(scene: Scene) {
          return scene.fogNode || this.get(scene).fogNode || null;
      }
  
 -    getCacheKey(scene, lightsNode) {
+-        const chain = [scene, lightsNode];
 +    getCacheKey(scene: Scene, lightsNode: LightsNode) {
-         const chain = [scene, lightsNode];
++        const chain = [scene, lightsNode] as const;
          const callId = this.renderer.info.calls;
  
-@@ -215,7 +231,7 @@ class Nodes extends DataMap {
+         let cacheKeyData = this.callHashCache.get(chain);
+@@ -215,7 +268,7 @@ class Nodes extends DataMap {
          return cacheKeyData.cacheKey;
      }
  
@@ -3643,7 +4022,7 @@ index 86df5654..b0389629 100644
          this.updateEnvironment(scene);
          this.updateFog(scene);
          this.updateBackground(scene);
-@@ -225,7 +241,7 @@ class Nodes extends DataMap {
+@@ -225,7 +278,7 @@ class Nodes extends DataMap {
          return this.renderer.getRenderTarget() ? false : true;
      }
  
@@ -3652,8 +4031,16 @@ index 86df5654..b0389629 100644
          const sceneData = this.get(scene);
          const background = scene.background;
  
-@@ -239,10 +255,10 @@ class Nodes extends DataMap {
-                     background.mapping === EquirectangularRefractionMapping
+@@ -234,15 +287,15 @@ class Nodes extends DataMap {
+                 let backgroundNode = null;
+ 
+                 if (
+-                    background.isCubeTexture === true ||
+-                    background.mapping === EquirectangularReflectionMapping ||
+-                    background.mapping === EquirectangularRefractionMapping
++                    (background as CubeTexture).isCubeTexture === true ||
++                    (background as CubeTexture).mapping === EquirectangularReflectionMapping ||
++                    (background as CubeTexture).mapping === EquirectangularRefractionMapping
                  ) {
                      backgroundNode = pmremTexture(background, normalWorld);
 -                } else if (background.isTexture === true) {
@@ -3667,7 +4054,7 @@ index 86df5654..b0389629 100644
                  }
  
                  sceneData.backgroundNode = backgroundNode;
-@@ -254,7 +270,7 @@ class Nodes extends DataMap {
+@@ -254,7 +307,7 @@ class Nodes extends DataMap {
          }
      }
  
@@ -3676,7 +4063,7 @@ index 86df5654..b0389629 100644
          const sceneData = this.get(scene);
          const fog = scene.fog;
  
-@@ -262,9 +278,9 @@ class Nodes extends DataMap {
+@@ -262,9 +315,9 @@ class Nodes extends DataMap {
              if (sceneData.fog !== fog) {
                  let fogNode = null;
  
@@ -3688,7 +4075,7 @@ index 86df5654..b0389629 100644
                      fogNode = rangeFog(
                          reference('color', 'color', fog),
                          reference('near', 'float', fog),
-@@ -283,7 +299,7 @@ class Nodes extends DataMap {
+@@ -283,7 +336,7 @@ class Nodes extends DataMap {
          }
      }
  
@@ -3697,7 +4084,7 @@ index 86df5654..b0389629 100644
          const sceneData = this.get(scene);
          const environment = scene.environment;
  
-@@ -291,7 +307,7 @@ class Nodes extends DataMap {
+@@ -291,7 +344,7 @@ class Nodes extends DataMap {
              if (sceneData.environment !== environment) {
                  let environmentNode = null;
  
@@ -3706,3 +4093,76 @@ index 86df5654..b0389629 100644
                      environmentNode = cubeTexture(environment);
                  } else if (environment.isTexture === true) {
                      environmentNode = texture(environment);
+@@ -308,7 +361,13 @@ class Nodes extends DataMap {
+         }
+     }
+ 
+-    getNodeFrame(renderer = this.renderer, scene = null, object = null, camera = null, material = null) {
++    getNodeFrame(
++        renderer = this.renderer,
++        scene: Scene | null = null,
++        object: Object3D | null = null,
++        camera: Camera | null = null,
++        material: Material | null = null,
++    ) {
+         const nodeFrame = this.nodeFrame;
+         nodeFrame.renderer = renderer;
+         nodeFrame.scene = scene;
+@@ -319,7 +378,7 @@ class Nodes extends DataMap {
+         return nodeFrame;
+     }
+ 
+-    getNodeFrameForRender(renderObject) {
++    getNodeFrameForRender(renderObject: RenderObject) {
+         return this.getNodeFrame(
+             renderObject.renderer,
+             renderObject.scene,
+@@ -329,7 +388,7 @@ class Nodes extends DataMap {
+         );
+     }
+ 
+-    getOutputNode(outputTexture) {
++    getOutputNode(outputTexture: Texture) {
+         let output = texture(outputTexture, viewportTopLeft);
+ 
+         if (this.isToneMappingState) {
+@@ -347,7 +406,7 @@ class Nodes extends DataMap {
+         return output;
+     }
+ 
+-    updateBefore(renderObject) {
++    updateBefore(renderObject: RenderObject) {
+         const nodeFrame = this.getNodeFrameForRender(renderObject);
+         const nodeBuilder = renderObject.getNodeBuilderState();
+ 
+@@ -356,7 +415,7 @@ class Nodes extends DataMap {
+         }
+     }
+ 
+-    updateForCompute(computeNode) {
++    updateForCompute(computeNode: ComputeNode) {
+         const nodeFrame = this.getNodeFrame();
+         const nodeBuilder = this.getForCompute(computeNode);
+ 
+@@ -365,7 +424,7 @@ class Nodes extends DataMap {
+         }
+     }
+ 
+-    updateForRender(renderObject) {
++    updateForRender(renderObject: RenderObject) {
+         const nodeFrame = this.getNodeFrameForRender(renderObject);
+         const nodeBuilder = renderObject.getNodeBuilderState();
+ 
+diff --git a/examples-jsm/examples/renderers/webgl/nodes/GLSLNodeBuilder.ts b/examples-jsm/examples/renderers/webgl/nodes/GLSLNodeBuilder.ts
+index 4910f51f..34e51ee8 100644
+--- a/examples-jsm/examples/renderers/webgl/nodes/GLSLNodeBuilder.ts
++++ b/examples-jsm/examples/renderers/webgl/nodes/GLSLNodeBuilder.ts
+@@ -595,7 +595,7 @@ void main() {
+         }
+     }
+ 
+-    getUniformFromNode(node, type, shaderStage, name = null) {
++    getUniformFromNode(node, type, shaderStage: 'vertex' | 'fragment' | 'compute', name = null) {
+         const uniformNode = super.getUniformFromNode(node, type, shaderStage, name);
+         const nodeData = this.getDataFromNode(node, shaderStage, this.globalCache);
+ 
diff --git a/examples-jsm/create-examples.js b/examples-jsm/create-examples.js
index 1ced58be7..0693e1f3a 100644
--- a/examples-jsm/create-examples.js
+++ b/examples-jsm/create-examples.js
@@ -17,18 +17,22 @@ const files = [
     'nodes/core/NodeUtils',
     'nodes/core/NodeVar',
     'nodes/core/NodeVarying',
+    'nodes/core/UniformGroupNode',
     'nodes/fog/FogNode',
     'nodes/gpgpu/ComputeNode',
     'nodes/lighting/EnvironmentNode',
     'nodes/lighting/LightsNode',
     'nodes/Nodes',
     'renderers/common/nodes/NodeBuilderState',
+    'renderers/common/nodes/NodeUniformsGroup',
     'renderers/common/nodes/Nodes',
     'renderers/common/Animation',
     'renderers/common/Attributes',
     'renderers/common/Backend',
     'renderers/common/Background',
+    'renderers/common/Binding',
     'renderers/common/Bindings',
+    'renderers/common/Buffer',
     'renderers/common/BufferUtils',
     'renderers/common/ChainMap',
     'renderers/common/ClippingContext',
@@ -51,7 +55,13 @@ const files = [
     'renderers/common/RenderObjects',
     'renderers/common/RenderPipeline',
     'renderers/common/Textures',
+    'renderers/common/UniformBuffer',
+    'renderers/common/UniformsGroup',
+    'renderers/webgl/nodes/GLSLNodeBuilder',
     'renderers/webgl/WebGLBackend',
+    'renderers/webgpu/nodes/WGSLNodeBuilder',
+    'renderers/webgpu/nodes/WGSLNodeFunction',
+    'renderers/webgpu/nodes/WGSLNodeParser',
     'renderers/webgpu/WebGPUBackend',
     'renderers/webgpu/WebGPURenderer',
 ];
diff --git a/examples-jsm/declarations.js b/examples-jsm/declarations.js
index 75158007a..8865e052b 100644
--- a/examples-jsm/declarations.js
+++ b/examples-jsm/declarations.js
@@ -10,16 +10,18 @@ const files = [
     'nodes/core/NodeParser',
     'nodes/core/NodeVar',
     'nodes/core/NodeVarying',
+    'renderers/common/nodes/NodeBuilderState',
+    'renderers/common/Binding',
     'renderers/common/ChainMap',
     'renderers/common/ClippingContext',
     'renderers/common/Color4',
     'renderers/common/Constants',
     'renderers/common/DataMap',
     'renderers/common/Info',
-    'renderers/common/RenderContexts',
     'renderers/common/RenderBundle',
     'renderers/common/RenderBundles',
     'renderers/common/RenderContext',
+    'renderers/common/RenderContexts',
     'renderers/common/RenderList',
     'renderers/common/RenderLists',
     'renderers/common/Textures',
@@ -33,6 +35,7 @@ for (const file of files) {
     const fileContents = fs.readFileSync(path.join(inDir, `${file}.d.ts`), { encoding: 'utf-8' });
     const outFile = path.join(outDir, `${file}.d.ts`);
     if (argv[2] === 'copy') {
+        fs.mkdirSync(path.dirname(outFile), { recursive: true });
         fs.writeFileSync(outFile, fileContents);
     } else if (argv[2] === 'check') {
         const outFileContents = fs.readFileSync(outFile, { encoding: 'utf-8' });
diff --git a/types/three/examples/jsm/nodes/core/Node.d.ts b/types/three/examples/jsm/nodes/core/Node.d.ts
index 008cc83d4..18635a544 100644
--- a/types/three/examples/jsm/nodes/core/Node.d.ts
+++ b/types/three/examples/jsm/nodes/core/Node.d.ts
@@ -76,7 +76,7 @@ declare class Node extends EventDispatcher<{
     readonly isNode: true;
     readonly id: number;
     self?: this;
-    constructor(nodeType?: null);
+    constructor(nodeType?: string | null);
     set needsUpdate(value: boolean);
     get type(): string | undefined;
     onUpdate(callback: (this: this, frame: NodeFrame) => void, updateType: NodeUpdateType): this;
diff --git a/types/three/examples/jsm/renderers/common/Binding.d.ts b/types/three/examples/jsm/renderers/common/Binding.d.ts
new file mode 100644
index 000000000..d45b028d5
--- /dev/null
+++ b/types/three/examples/jsm/renderers/common/Binding.d.ts
@@ -0,0 +1,8 @@
+declare class Binding {
+    name: string;
+    visibility: number;
+    constructor(name?: string);
+    setVisibility(visibility: number): void;
+    clone(): Binding & this;
+}
+export default Binding;
diff --git a/types/three/examples/jsm/renderers/common/nodes/NodeBuilderState.d.ts b/types/three/examples/jsm/renderers/common/nodes/NodeBuilderState.d.ts
new file mode 100644
index 000000000..30229f73f
--- /dev/null
+++ b/types/three/examples/jsm/renderers/common/nodes/NodeBuilderState.d.ts
@@ -0,0 +1,25 @@
+import Node from "../../../nodes/core/Node.js";
+import NodeAttribute from "../../../nodes/core/NodeAttribute.js";
+import Binding from "../Binding.js";
+declare class NodeBuilderState {
+    vertexShader: string | null;
+    fragmentShader: string | null;
+    computeShader: string | null;
+    nodeAttributes: NodeAttribute[];
+    bindings: Binding[];
+    updateNodes: Node[];
+    updateBeforeNodes: Node[];
+    usedTimes: number;
+    constructor(
+        vertexShader: string | null,
+        fragmentShader: string | null,
+        computeShader: string | null,
+        nodeAttributes: NodeAttribute[],
+        bindings: Binding[],
+        updateNodes: Node[],
+        updateBeforeNodes: Node[],
+        transforms?: never[],
+    );
+    createBindings(): Binding[];
+}
+export default NodeBuilderState;