Can Threejs renderer render same scene in multiple canvases, so I want to render once and show it in two canvases. Note, that I dont want to render it twice, I just need to reflect one canvas into other. Thank you.
That's quite simple and it doesn't involve three.js anymore but simply copying one canvas output to another canvas.
https://jsfiddle.net/VsWb9/5357/
// copy source canvas to the other canvas after each render iteration
pipctx.drawImage(renderer.domElement, 0, 0, 200, 200);
Update
Here's a solution with better performance(for Chrome and Firefox but not Edge yet):
Capture stream from the Three's canvas element
dataUrl = URL.createObjectURL(renderer.domElement.captureStream(45));
Attach that stream to <video>'s src attribute
pip = document.createElement('video');
pip.style.width = pip.style.height = '200px';
document.body.appendChild(pip);
pip.src = dataUrl;
pip.play();
This way you don't have to refresh mirrored elements after every frame render. They will automatically keep up to date with the stream captured from the source canvas. This solution will need fallback to the version above for browsers where captureStream is not available. Example showing 100 video elements reflecting what's in main Three's canvas: