Material.onBeforeCompile()方法是 Three.js 材质系统中的一种高级技巧，它允许开发者在材质编译前对其进行自定义的修改。在该方法中，开发者可以访问和修改 GLSL 代码，以实现各种特殊的效果。
function onBeforeCompile(shader: THREE.Shader, renderer: THREE.WebGLRenderer): void;
shader：THREE.Shader类型，表示当前正在编译的着色器。renderer：THREE.WebGLRenderer类型，表示当前正在使用的渲染器对象。该方法没有返回值。
可以通过重写材料对象的 onBeforeCompile() 方法来实现对编译过程的个性化定制。在该方法中，开发者可以针对当前材质所用的着色器代码进行修改。
以下是一个简单的示例，展示如何在一个着色器的片段着色器中添加一个自定义的变量：
var material = new THREE.MeshBasicMaterial();
material.onBeforeCompile = function (shader, renderer) {
shader.fragmentShader = "varying vec3 vNormal;\n" + shader.fragmentShader;
shader.fragmentShader = shader.fragmentShader.replace(
"#include <normal_fragment>",
"vNormal = normalize( transformedNormal );\n" +
"#include <normal_fragment>"
);
};
上面的代码中，先在片段着色器中添加了一个自定义的变量 vNormal，然后在原来的“法向量计算”代码前，添加了一行计算 该变量的代码。
最后，在设置完成后，当需要使用该材质进行渲染时，不管是使用场景的 render() 方法，还是自己手动调用 WebGLRenderer 的 render() 方法，在渲染之前，都会自动执行一次调用 onBeforeCompile() 方法。
onBeforeCompile() 方法只能在材质初始化之后调用，否则可能会出现意想不到的错误。