depth peeling

function renderDepthPeel() {

  // 清空主渲染帧缓冲区
  renderer.setClearColor(0x0, 1)
  renderer.clear()

  // 设置深度剥离着色器的 uniform 变量 uLayer 的值为0，表示渲染第一层
  globalPeelUniforms.uLayer.value = 0

  // 渲染第一层深度信息
  // 将场景中所有物体的材质都设置为 depthMaterial，用于渲染深度信息
  scene.overrideMaterial = depthMaterial
  renderer.setClearColor(0xffffff, 1)
  renderer.render(scene, camera, targets[0], true)

  // 渲染第一层颜色信息
  // 将场景中所有物体的材质还原为原来的材质
  scene.overrideMaterial = null
  // 将渲染器的背景颜色设置为黑色，透明度为0（完全透明）
  renderer.setClearColor(0x000, 0)
  renderer.render(scene, camera, targets[2], true)

  for (let i = 0; i < options.layers; i++) {

    // 计算当前层和上一层的颜色和深度信息在四个渲染目标中的下标
    const a = i % 3 // 当前层颜色信息
    const b = (i + 1) % 3 // 下一层深度信息
    const c = (i + 2) % 3 // 上一层颜色信息
    const d = 3 // 当前层深度和颜色信息

    // 设置深度剥离着色器的 uniform 变量 uPrevDepthTexture 的值为上一层的深度信息
    globalPeelUniforms.uPrevDepthTexture.value = targets[a]
    // 设置深度剥离着色器的 uniform 变量 uLayer 的值为当前层的层数
    globalPeelUniforms.uLayer.value = i + 1

    // 渲染下一层深度信息
    scene.overrideMaterial = depthMaterial
    renderer.setClearColor(0xffffff, 1)
    renderer.render(scene, camera, targets[b], true)

    // 对当前层进行深度剥离，将深度信息和颜色信息渲染到当前层的渲染目标上
    scene.overrideMaterial = null
    renderer.setClearColor(0x000, 0)
    renderer.render(scene, camera, targets[d], true)

    // 将上一层的颜色信息和当前层的颜色信息进行合并，渲染到上一层的颜色信息所在的渲染目标上
    compositeMaterial.uniforms.uTextureA.value = targets[c]
    compositeMaterial.uniforms.uTextureB.value = targets[d]
    renderer.render(compositeScene, camera, targets[a], true)
  }

  // 渲染最终结果
  // 将深度剥离着色器的 uniform 变量 uPrevDepthTexture 的值设为 null，表示不使用之前的深度信息
  globalPeelUniforms.uPrevDepthTexture.value = null
  // 隐藏所有透明物体，只渲染不透明物体
  transparentObjects.forEach(o => o.visible = false)
  renderer.render(scene, camera) // 渲染不透明物体
  renderer.render(compositeScene, camera) // 渲染深度剥离效果
  transparentObjects.forEach(o => o.visible = true) // 恢复透明物体的可见性
}