Three.js: WebGL Mirror Example Artifacts

Indeed.
Also see this topic: https://github.com/mrdoob/three.js/issues/11885
At the end I get the feeling the Mirror is not properly implemented.

The main camera's aspect ratio is never copied to the mirror camera.

// "examples/Mirror.js" (lines 142-146)
mirrorCamera.near = camera.near;
mirrorCamera.far = camera.far;
mirrorCamera.updateMatrixWorld();
mirrorCamera.updateProjectionMatrix();

Should be changed to:

mirrorCamera.updateMatrixWorld();
mirrorCamera.projectionMatrix.copy(camera.projectionMatrix);

I'll send a PR for this later!

Another problem with the mirror (and the planar ocean) is that it doesn't seem to work when thelogarithmicDepthBuffer is enabled. Oblique near plane clipping messes with depth and I never found a solution for this. I wish WebGL had glClipPlane 😞

@vanruesc I was messing with the code so I implemented it directly. Many thanks!

@mrdoob If you are still messing around, I think there is room for simplification...

//mirrorCamera.up.set( 0, - 1, 0 );
//mirrorCamera.up.applyMatrix4( rotationMatrix );
//mirrorCamera.up.reflect( normal ).negate();

mirrorCamera.up.set( 0, 1, 0 ).applyMatrix4( rotationMatrix ).reflect( normal );

@WestLangley Thanks!