Is renderer.render() blocking or non-blocking?

Question

I need to take a screen shot after every rendered frame completes, but I'm finding that some screen shots are duplicates, so I'm wondering if I might be saving the screen shot before the render is finished. Thus...

1. Does renderer.render() block until it finishes rendering?
2. If not, is there a way to know via callback or event when it is complete?

Answer 1

I created a render test with 50k cubes which on my laptop takes about 6-10 seconds.

The fiddle is here: http://jsfiddle.net/1ma18gLf/

The function does block based on the test. Use the browser console to watch the result and see the base64 image.

The question then becomes does webGL paint to the canvas separately regardless of what JavaScript is doing.

You could try a manual clear before the render:

var renderer = new THREE.WebGLRenderer( { preserveDrawingBuffer: true } );
renderer.autoClear = false;

//In your render loop:

renderer.clear();
renderer.render( scene, camera );