THREE.TextureLoader() loads the same texture multiple times (i.e. 20 times or more)

Description of the problem

The THREE.TextureLoader() behaves in an unexpected and erroneous way. The load() function of the class tries/loads the same assets multiple times (i.e. 20 times or more).

Below in figure is illustrated this behaviour using the browser console:

The code used to load and use textures follows next:

var Element = function (texture) {
    this.texture = texture;
Element.prototype.createShaderMaterial = function (uniforms, vertexShader, fragmentShader) {
    var loader = new THREE.TextureLoader();
    uniforms.texture.value = loader.load(this.texture);

    return new THREE.ShaderMaterial({
        uniforms: uniforms,
        vertexShader: vertexShader,
        fragmentShader: fragmentShader,
        wireframe: true

For debugging purposes you can also find a live preview here: and the game code here:

Three.js version
  • Dev
  • r81
  • r80
  • All of them
  • Chrome
  • Firefox
  • Internet Explorer
  • All of them
  • Windows
  • Linux
  • Android
  • IOS
Hardware Requirements (graphics card, VR Device, …)

Author: Fantashit

1 thought on “THREE.TextureLoader() loads the same texture multiple times (i.e. 20 times or more)

Comments are closed.