SSRPass Reflection Creates Artifacts For Animated Model

These artifacts do not move/animate. They are static in the scene. Any idea what is it and how to get rid of them? Thanks!

        var selects = [];
        const params = {
			enableSSR: true,
			groundReflector: true,
        var geometry = new THREE.PlaneBufferGeometry( 20, 20 );
        this.groundReflector = new THREE.ReflectorForSSRPass( geometry, {
            clipBias: 0.0003,
            textureWidth: window.innerWidth,
            textureHeight: window.innerHeight,
            color: 0x888888,
            useDepthTexture: true,
        } );
        this.groundReflector.material.depthWrite = false;
        this.groundReflector.rotation.x = - Math.PI / 2;
        this.groundReflector.visible = false;
        this.groundReflector.opacity = 0.15;
        //this.groundReflector.maxDistance = 5;
        this.scene.add( this.groundReflector );
        var renderer = this.renderer;
        var scene = this.scene;
        var camera =;
        var ww = this.iw;
        var hh = this.ih;
        this.ssrPass = new THREE.SSRPass({
            width: ww,
            height: hh,
            encoding: THREE.sRGBEncoding,
            groundReflector: this.groundReflector,
            //selects: params.groundReflector ? selects : null
        //this.ssrPass.infiniteThick = true;
        this.composer.addPass( this.ssrPass );

cc @gonnavis

The “artifacts” on the model look like reflections of the environment. If the reflections on the model are static even with animation my suspicion is that the SSRRPass does not support SkinnedMesh animations. I suspect you should be able to remove the reflections by lowering the metalness and / or increasing the roughness of the SkinnedMesh but @gonnavis would know more about the SSRPass API.


Hello, may geometry.computeVertexNormals() can solve this problem.