VREffect: Avoid cloning cameras every render.

examples/js/effects/VREffect.js

@@ -22,6 +22,10 @@
  *
  */
 THREE.VREffect = function ( renderer, done ) {
+
+	var cameraLeft = new THREE.PerspectiveCamera();
+	var cameraRight = new THREE.PerspectiveCamera();
+
 	this._renderer = renderer;
 
 	this._init = function() {
@@ -72,36 +76,36 @@ THREE.VREffect = function ( renderer, done ) {
 			return;
 		}
 		// Regular render mode if not HMD
-		renderer.render.apply( this._renderer , arguments );
+		renderer.render.apply( this._renderer, arguments );
 	};
 
 	this.renderStereo = function( scene, camera, renderTarget, forceClear ) {
-		var cameraLeft;
-		var cameraRight;
+
 		var leftEyeTranslation = this.leftEyeTranslation;
 		var rightEyeTranslation = this.rightEyeTranslation;
 		var renderer = this._renderer;
 		var rendererWidth = renderer.domElement.width / renderer.devicePixelRatio;
 		var rendererHeight = renderer.domElement.height / renderer.devicePixelRatio;
 		var eyeDivisionLine = rendererWidth / 2;
+
 		renderer.enableScissorTest( true );
 		renderer.clear();
 
 		// Grab camera matrix from user.
 		// This is interpreted as the head base.
+
 		if ( camera.matrixAutoUpdate ) {
 			camera.updateMatrix();
 		}
-		var eyeWorldMatrix = camera.matrixWorld.clone();
 
-		cameraLeft = camera.clone();
-		cameraRight = camera.clone();
 		cameraLeft.projectionMatrix = this.FovToProjection( this.leftEyeFOV );
 		cameraRight.projectionMatrix = this.FovToProjection( this.rightEyeFOV );
-		cameraLeft.position.add(new THREE.Vector3(
-			leftEyeTranslation.x, leftEyeTranslation.y, leftEyeTranslation.z) );
-		cameraRight.position.add(new THREE.Vector3(
-			rightEyeTranslation.x, rightEyeTranslation.y, rightEyeTranslation.z) );
+
+		cameraLeft.position.x = camera.position.x + leftEyeTranslation.x;
+		cameraLeft.quaternion.copy( camera.quaternion );
+
+		cameraRight.position.x = camera.position.x + rightEyeTranslation.x;
+		cameraRight.quaternion.copy( camera.quaternion );
 
 		// render left eye
 		renderer.setViewport( 0, 0, eyeDivisionLine, rendererHeight );

examples/webgl_effects_vr.html

@@ -105,7 +105,7 @@
 				projector = new THREE.Projector();
 				raycaster = new THREE.Raycaster();
 
-				renderer = new THREE.WebGLRenderer();
+				renderer = new THREE.WebGLRenderer( { antialias: true } );
 
 				var fullScreenButton = document.querySelector( '.button' );
 				fullScreenButton.onclick = function() {

src/cameras/PerspectiveCamera.js

@@ -119,5 +119,10 @@ THREE.PerspectiveCamera.prototype.updateProjectionMatrix = function () {
 
 THREE.PerspectiveCamera.prototype.clone = function () {
 
-	return new THREE.PerspectiveCamera( this.fov, this.aspect, this.near, this.far );
+	var camera = new THREE.PerspectiveCamera( this.fov, this.aspect, this.near, this.far );
+
+	THREE.Camera.prototype.clone.call( this, camera );
+
+	return camera;
+
 };