Three.js 3JS上的球体视点替用器

我正在用ThreeJS在GLSL上开发一个球体视点替用器着色器。我的算法基于Sigg等人的出版物“基于GPU的二次曲面光线投射”

使用经典几何体方法时，需要几十个甚至数百个三角形来表示每个球体。如果需要显示数千个球体，可能会导致内存过载。球体视点替用器允许您仅存储几何体上的位置和半径以显示球体，与以前的技术相比，它提供了更高的性能

现在，我成功地开发了着色器，甚至通过使用ThreeJS着色器块来确保完全的ThreeJS兼容性。你可以找到一个演示页面。然而，最后一件事是不能在这个实现上工作

在场景中移动对象时，使用球体视点替用器的对象似乎比普通网格延迟。您还可以注意到，有些时候，球体像on一样被“切割”

第二个bug让我认为精灵被顶点着色器很好地放置到场景中，但是片段着色器计算的坐标错误。我怀疑有两段代码存在问题：

• 顶点着色器向片段着色器提供的两个变量，应为精灵的每个像素提供相同的值。我不知道如何验证这一点

  varying float projMatrix11;
  varying float projMatrix22;
  

• 我不知道更新我的着色器制服是否做得很好

  group.traverse(function(o) {
      if (!o.material) { return; }
  
      var u = o.material.uniforms;
      if (!u) { return; }
  
      modelViewMatrixInverse.getInverse(
          o.modelViewMatrix
      );
  
      if (u.projectionMatrixInverse) {
          u.projectionMatrixInverse.value = projectionMatrixInverse;
      }
  
      if (u.projectionMatrixTranspose) {
          u.projectionMatrixTranspose.value = projectionMatrixTranspose;
      }
  
      if (u.modelViewMatrixInverse) {
          u.modelViewMatrixInverse.value = modelViewMatrixInverse;
      }
  
      if (u.viewport) {
          u.viewport.value = viewport;
      }
  });
  

我无法调试这个问题，希望比我更了解ThreeJS的人能给我一些线索

我真的希望我们能解决这个问题，这样我们就可以向整个ThreeJS社区推荐这个功能；）

注意：为了便于调试，我延迟了对requestAnimationFrame的调用

---

编辑：挖掘更多信息后，问题可能来自我如何更新定制制服。其中一个使用modelViewMatrix来得到它的逆矩阵。但是modelViewMatrix仅在WebGLRenderer的渲染调用期间更新，因此帧延迟可能由此产生。如何更新依赖于其他制服的制服，并使它们在ThreeJS上保持同步？

单独找到答案，如果有人遇到同样的问题，我将在这里解释

问题是我使用ThreeJS提供的modelViewMatrix更新modelViewMatrixInverse uniform。此统一仅在WebGLRenderer的render（）方法调用期间更新，并且我的modelViewMatrixInverse在每次渲染调用时延迟一帧。这就是为什么我的自定义着色器每次都比三个本地着色器晚一帧的原因