Three.js 三重优化光线投射

我正在生成3个尺寸大约为400x300的平面，现在我需要对它们进行细分以进行一些顶点着色器操作

由于缓冲几何体，我的平面几乎是瞬间生成的，现在的问题是，通过细分，它使我的帧速率非常低。我猜这必须使用我的光线投射器，它在渲染循环中调用，并沿鼠标位置进行光线投射

我的问题是，我可以做一些优化来解决性能下降的问题吗

以下是生成网格的方法：

function GeneratePlaneLayer(y) {
  var floorTexture = new THREE.ImageUtils.loadTexture('path/to/image'); 
  floorTexture.magFilter = THREE.NearestFilter;
  floorTexture.minFilter = THREE.NearestFilter;


  floorTexture.wrapS = floorTexture.wrapT = THREE.ClampToEdgeWrapping; 
  floorTexture.repeat.set(1, 1);

  var floorMaterial = new THREE.MeshBasicMaterial({
    map: floorTexture,
    side: THREE.DoubleSide,
    transparent: true
  });

  var geometry = new THREE.PlaneBufferGeometry(400, 300, 400, 300);
  var floor = new THREE.Mesh(geometry, floorMaterial);

  floor.rotation.x = -(Math.PI / 2);

  floor.position.x = maxs['ROW'] / 2;
  floor.position.z = maxs['COL'] / 2;

  floor.position.y = y;

  return floor;
}

编辑：

---

我试着用一个八叉树，但上面写着三个，八叉树是不存在的。我在文档中也找不到它，它只是在开发版本中吗？

看看@Gaitat，你想解释一下八叉树是什么吗？或者至少给我一些关于它的更多信息的链接为什么不使用PlaneBuffer几何400、300、1、1？@WestLangley，因为稍后我将向网格添加高度贴图