first pass minimise binds

examples/jsm/renderers/webgl/WebGLBackend.js

@@ -42,6 +42,10 @@ class WebGLBackend extends Backend {
 
 		this.extensions.get( 'EXT_color_buffer_float' );
 
+		this.maxTexture = this.gl.getParameter( this.gl.MAX_TEXTURE_IMAGE_UNITS );
+		this.activeTextureUnit = null;
+		this.textureBindings = Array( this.maxTexture );
+
 	}
 
 	get coordinateSystem() {
@@ -279,8 +283,7 @@ class WebGLBackend extends Backend {
 
 			} else if ( binding.isSampledTexture ) {
 
-				gl.activeTexture( gl.TEXTURE0 + index );
-				gl.bindTexture( bindingData.glTextureType, bindingData.textureGPU );
+				this._bindTexture( binding.texture, index );
 
 			}
 
@@ -422,12 +425,26 @@ class WebGLBackend extends Backend {
 		const glTextureType = textureUtils.getGLTextureType( texture );
 
 		let textureGPU = defaultTextures[ glTextureType ];
+		let firstUse = false;
 
 		if ( textureGPU === undefined ) {
 
 			textureGPU = gl.createTexture();
+			firstUse = true;
+
+		}
+
+		this.set( texture, {
+			textureGPU,
+			glTextureType,
+			isDefault: true,
+			unit: null
+		} );
+
+		if ( firstUse ) {
+
+			this._bindTexture( texture );
 
-			gl.bindTexture( glTextureType, textureGPU );
 			gl.texParameteri( glTextureType, gl.TEXTURE_MIN_FILTER, gl.NEAREST );
 			gl.texParameteri( glTextureType, gl.TEXTURE_MAG_FILTER, gl.NEAREST );
 
@@ -437,12 +454,6 @@ class WebGLBackend extends Backend {
 
 		}
 
-		this.set( texture, {
-			textureGPU,
-			glTextureType,
-			isDefault: true
-		} );
-
 	}
 
 	createTexture( texture, options ) {
@@ -457,7 +468,16 @@ class WebGLBackend extends Backend {
 		const textureGPU = gl.createTexture();
 		const glTextureType = textureUtils.getGLTextureType( texture );
 
-		gl.bindTexture( glTextureType, textureGPU );
+		this.set( texture, {
+			textureGPU,
+			glTextureType,
+			glFormat,
+			glType,
+			glInternalFormat,
+			unit: null
+		} );
+
+		this._bindTexture( texture );
 
 		gl.pixelStorei( gl.UNPACK_FLIP_Y_WEBGL, texture.flipY );
 		gl.pixelStorei( gl.UNPACK_PREMULTIPLY_ALPHA_WEBGL, texture.premultiplyAlpha );
@@ -466,22 +486,12 @@ class WebGLBackend extends Backend {
 
 		textureUtils.setTextureParameters( glTextureType, texture );
 
-		gl.bindTexture( glTextureType, textureGPU );
-
 		if ( ! texture.isVideoTexture ) {
 
 			gl.texStorage2D( glTextureType, levels, glInternalFormat, width, height );
 
 		}
 
-		this.set( texture, {
-			textureGPU,
-			glTextureType,
-			glFormat,
-			glType,
-			glInternalFormat
-		} );
-
 	}
 
 	updateTexture( texture, options ) {
@@ -506,7 +516,7 @@ class WebGLBackend extends Backend {
 
 		};
 
-		gl.bindTexture( glTextureType, textureGPU );
+		this._bindTexture( texture );
 
 		if ( texture.isCubeTexture ) {
 
@@ -540,9 +550,10 @@ class WebGLBackend extends Backend {
 	generateMipmaps( texture ) {
 
 		const { gl } = this;
-		const { textureGPU, glTextureType } = this.get( texture );
+		const { glTextureType } = this.get( texture );
+
+		this._bindTexture( texture );
 
-		gl.bindTexture( glTextureType, textureGPU );
 		gl.generateMipmap( glTextureType );
 
 	}
@@ -834,17 +845,14 @@ class WebGLBackend extends Backend {
 
 		const { gl } = this;
 
-		const { textureGPU } = this.get( texture );
-
 		gl.bindFramebuffer( gl.FRAMEBUFFER, null );
-		gl.bindTexture( gl.TEXTURE_2D, textureGPU );
+
+		this._bindTexture( texture );
 
 		gl.copyTexSubImage2D( gl.TEXTURE_2D, 0, 0, 0, 0, 0, texture.image.width, texture.image.height );
 
 		if ( texture.generateMipmaps ) gl.generateMipmap( gl.TEXTURE_2D );
 
-		gl.bindTexture( gl.TEXTURE_2D, null );
-
 	}
 
 	_setFramebuffer( renderContext ) {
@@ -906,6 +914,36 @@ class WebGLBackend extends Backend {
 
 	}
 
+	_bindTexture( texture, unit ) {
+
+		const textureData = this.get( texture );
+
+		const { gl, textureBindings, maxTexture } = this;
+		const { glTextureType, textureGPU } = textureData;
+
+		if ( unit === undefined ) unit = textureData.unit === null ? maxTexture - 1 : textureData.unit;
+
+		if ( this.activeTextureUnit !== unit ) {
+
+			gl.activeTexture( gl.TEXTURE0 + unit );
+			this.activeTextureUnit = unit;
+
+		}
+
+		if ( textureBindings[ unit ] !== textureGPU ) {
+
+			const oldBinding = textureBindings[ unit ];
+			if ( oldBinding !== undefined ) oldBinding.unit = null;
+
+			gl.bindTexture( glTextureType, textureGPU );
+
+			textureBindings[ unit ] = textureGPU;
+			textureData.unit = unit;
+
+		}
+
+	}
+
 }
 
 export default WebGLBackend;